/*

	Filename:          style.css
	Type:              Cascading Style Sheet
	Description:       General style sheet
	Site:              LoopNorth.com
	Author:            Steven Dahlman, DCMSoft LLC
	Start date:        01-26-23
	Last modification: 11-24-24

	Colors:
	#000000 - Black
	#0000ff - Blue
	#0047ab - Cobalt blue
	#191970 - Midnight blue
	#87cefa - Light sky blue
	#888888 - Darker gray
	#f0f0f0 - Gray
	#f6f6f6 - Lighter gray
	#ff0000 - Red
	#c94543 - Lighter red
	#ffffff - White

*/

/* -------------------------------------------------------------------------------- */
/* BODY                                                                             */
/* -------------------------------------------------------------------------------- */

/* Body */
body {
  background-color: #ffffff;
  height: 100%;
  margin: 0 0 0 0;
  overflow-x: hidden;
}

/* -------------------------------------------------------------------------------- */
/* BUTTON                                                                           */
/* -------------------------------------------------------------------------------- */

.button1 {
  background-color: #ffffff;
  border: 2px outset #f0f0f0;
  color: #000000;
  font-family: Helvetica;
  font-size: 11pt;
  padding: 4.4px;
  width: 100px;
}

/* -------------------------------------------------------------------------------- */
/* DIVISIONS                                                                        */
/* -------------------------------------------------------------------------------- */

/* Command output */
.cmdout {
  border: 1px solid #000000;
  color: #000000;
  font-family: Courier New;
  font-size: 10pt;
  padding: 10px;
  text-align: left;
}

/* Newsletter signup dialog */
.signup {
  background-color: #ffffff;
  border: 1px solid #f0f0f0;
  color: #000000;
  font-family: Helvetica;
  font-size: 10pt;
  line-height: 125%;
  padding: 10px;
  text-align: center;
}

/* Menu of most recent stories */
.story_menu {
  background-color: #808080;
  bottom: 8px;
  color: #ffffff;
  font-family: Helvetica;
  font-size: 12pt;
  font-weight: bold;
  left: 4px;
  line-height: 125%;
  opacity: 90%;
  padding: 8px;
  position: absolute;
  text-align: left;
}

/* -------------------------------------------------------------------------------- */
/* DROPDOWN LIST                                                                    */
/* -------------------------------------------------------------------------------- */

.selopt1 {
  background-color: #ffffff;
  border: 2px inset #f0f0f0;
  color: #000000;
  font-family: Verdana;
  font-size: 10pt;
  padding: 4px;
}

/* -------------------------------------------------------------------------------- */
/* LINKS                                                                            */
/* -------------------------------------------------------------------------------- */

/*
 * Loop North Data Services
 */

.data_menu:link {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 11pt;
  text-align: center;
  text-decoration: none;
}

.data_menu:visited {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 11pt;
  text-align: center;
  text-decoration: none;
}

.data_menu:hover {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 11pt;
  text-align: center;
  text-decoration: underline;
}

.data_menu:active {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 11pt;
  text-align: center;
  text-decoration: none;
}

/*
 * Main menu
 */

.main_menu:link {
  color: #87cefa;
  font-family: Helvetica;
  font-size: 10pt;
  text-align: left;
  text-decoration: none;
}

.main_menu:visited {
  color: #87cefa;
  font-family: Helvetica;
  font-size: 10pt;
  text-align: left;
  text-decoration: none;
}

.main_menu:hover {
  color: #87cefa;
  font-family: Helvetica;
  font-size: 10pt;
  text-align: left;
  text-decoration: underline;
}

.main_menu:active {
  color: #87cefa;
  font-family: Helvetica;
  font-size: 10pt;
  text-align: left;
  text-decoration: none;
}

/*
 * "More info" links
 */

.moreinfo:link {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 11pt;
  text-align: left;
  text-decoration: none;
}

.moreinfo:visited {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 11pt;
  text-align: left;
  text-decoration: none;
}

.moreinfo:hover {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 11pt;
  text-align: left;
  text-decoration: underline;
}

.moreinfo:active {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 11pt;
  text-align: left;
  text-decoration: none;
}

/*
 * Home page headlines
 */

.newshead:link {
  color: #000000;
  font-family: "Merriweather", serif;
  font-size: 18pt;
  line-height: 125%;
  text-align: left;
  text-decoration: none;
}

.newshead:visited {
  color: #000000;
  font-family: "Merriweather", serif;
  font-size: 18pt;
  line-height: 125%;
  text-align: left;
  text-decoration: none;
}

.newshead:hover {
  color: #ff0000;
  font-family: "Merriweather", serif;
  font-size: 18pt;
  line-height: 125%;
  text-align: left;
  text-decoration: none;
}

.newshead:active {
  color: #000000;
  font-family: "Merriweather", serif;
  font-size: 18pt;
  line-height: 125%;
  text-align: left;
  text-decoration: none;
}

/*
 * Link to display map of address
 */

.maplink:link {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 12pt;
  text-align: left;
  text-decoration: none;
}

.maplink:visited {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 12pt;
  text-align: left;
  text-decoration: none;
}

.maplink:hover {
  color: #0000ff;
  font-family: "Roboto", sans-serif;
  font-size: 12pt;
  text-align: left;
  text-decoration: none;
}

.maplink:active {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 12pt;
  text-align: left;
  text-decoration: none;
}

/* -------------------------------------------------------------------------------- */
/* NEWS TEXT                                                                        */
/* -------------------------------------------------------------------------------- */

/* Byline */
.article_byline {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 12pt;
  font-weight: bold;
  line-height: 125%;
  text-align: left;
}

/* Text with special emphasis */
.article_emphasis {
  color: #191970;
  font-family: "Merriweather", serif;
  font-size: 15pt;
  line-height: 150%;
  padding: 8px;
  text-align: left;
}

/* Large headline */
.article_headline1 {
  color: #000000;
  font-family: "Merriweather", serif;
  font-size: 24pt;
  text-align: left;
}

/* Small headline (mobile version) */
.article_headline2 {
  color: #000000;
  font-family: "Merriweather", serif;
  font-size: 18pt;
  line-height: 125%;
  text-align: left;
}

/* Default story text */
.article_text {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 12pt;
  line-height: 125%;
  text-align: left;
}

/* "Downtown Briefs" headline */
.brief_headline {
  color: #000000;
  font-family: "Merriweather", serif;
  font-size: 12pt;
  line-height: 125%;
  text-align: left;
}

/* "Downtown Briefs" text */
.brief_text {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 10pt;
  line-height: 125%;
  text-align: left;
}

/* Photo caption */
.caption {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 10pt;
  line-height: 125%;
  text-align: left;
}

/* Photo caption (right-aligned) */
.caption_right {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 10pt;
  line-height: 125%;
  text-align: right;
}

/* Category */
.category {
  color: #c94543;
  font-family: 'Roboto';
  font-size: 10pt;
  text-align: left;
}

/* Credit */
.credit {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 11pt;
  font-style: italic;
  text-align: left;
}

/* Headline over image */
.headoverimage {
  background-color: #808080;
  bottom: 15px;
  color: #ffffff;
  font-family: Merriweather;
  font-size: 22pt;
  font-weight: bold;
  left: 10px;
  letter-spacing: 2px;
  line-height: 125%;
  opacity: 90%;
  padding: 5px;
  position: absolute;
  text-align: left;
  text-shadow: 2px 2px #000000;
}

/* Lede */
.lede {
  background-color: #f6f6f6;
  color: #000000;
  font-family: "Merriweather", serif;
  font-size: 14pt;
  line-height: 150%;
  margin-top: 4px;
  padding: 8px;
  text-align: left;
}

/* Map point */
.map_point {
  -moz-border-radius: 0.8em;
  -webkit-border-radius: 0.8em;
  background: #990000;
  border-radius: 0.8em;
  color: #ffffff;
  display: inline-block;
  font-family: Verdana;
  font-size: 11pt;
  font-weight: bold;
  line-height: 1.6em;
  margin-right: 5px;
  text-align: center;
  width: 1.6em;
}

/* -------------------------------------------------------------------------------- */
/* OTHER TEXT                                                                       */
/* -------------------------------------------------------------------------------- */

/* Default text */
.default_text {
  color: #000000;
  font-family: Helvetica;
  font-size: 12pt;
  line-height: 125%;
  text-align: left;
}

/* Text with special emphasis */
.emphasis_text {
  color: #191970;
  font-family: "Merriweather", serif;
  font-size: 15pt;
  line-height: 150%;
  text-align: left;
}

/* Error message */
.error_message {
  color: #ff0000;
  font-family: Helvetica;
  font-size: 11pt;
  text-align: center;
}

/* Fixed-width text */
.fixed {
  color: #000000;
  font-family: Courier New;
  font-size: 12pt;
}

/* Page footer */
.footer {
  color: #000000;
  font-family: Helvetica;
  font-size: 10pt;
  text-align: center;
}

/* Page title */
.page_title {
  color: #191970;
  font-family: Helvetica;
  font-size: 24pt;
  line-height: 125%;
  text-align: center;
}

/* Small text */
.small_text {
  color: #000000;
  font-family: Helvetica;
  font-size: 10pt;
  text-align: center;
}

/* Tagline */
.tagline {
  color: #191970;
  font-family: Helvetica;
  font-size: 11pt;
  font-style: italic;
  text-align: center;
}

/* Temperature */
.temperature {
  color: #0047ab;
  font-family: Georgia;
  font-size: 24pt;
  text-align: right;
}

/* Weather text */
.weather_text {
  color: #191970;
  font-family: Helvetica;
  font-size: 10pt;
  line-height: 150%;
  text-align: center;
}

/* -------------------------------------------------------------------------------- */
/* TEXT INPUT                                                                       */
/* -------------------------------------------------------------------------------- */

.text_input1 {
  background-color: #ffffff;
  border: 2px inset #f0f0f0;
  color: #000000;
  font-family: Courier New;
  font-size: 10pt;
  padding: 5px;
  text-align: center;
}