// For styles applied to all media regardless of width, which can be overriden for other media.

body {}

#page {}

h3 {
  border-bottom: 1px dotted darken(@bodyColor, 66.66%);
}

fieldset {
  border: 1px solid darken(@bodyColor, 20%);
}

thead th {
  background: darken(@bodyColor, 4%);
  border-bottom: 1px solid darken(@bodyColor, 20%);
  border-top: darken(@bodyColor, 20%);
}

tr.odd {
  background: @bodyColor;
}

tr.even {
  background: darken(@bodyColor, 4%);
}

.sticky-header th, .sticky-table th {
  border-bottom: @size4 solid lighten(@colorBase, 40%);
}

abbr[title] {
  border-bottom: 1px dotted lighten(@textColor, 50%);
}

blockquote {
  color: lighten(@textColor, 20%);
  border-left: @size4 solid lighten(@textColor, 20%);
}

hr {
  background: @textColor;
}

mark {
  background: lighten(@colorBase, 50%);
  color: darken(@colorBase, 100%);
}

// buttons
input[type="button"],
input[type="submit"],
input[type="reset"],
input[type="file"],
button,
input.form-submit,
a.button {
  .button();
  margin-right: @size3;
  text-transform: uppercase;
}

input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
input[type="week"],
select,
textarea {
  .vertical-gradient(@colorWhite, darken(@colorWhite, 5%));
  color: darken(@colorWhite, 100%);
}

#page {}

.wrapper {} // Target all full-width wrappers. To use, see groundwork/resources/templates/README.txt.
#topbar-wrapper {}
#header-wrapper {}
#navigation-wrapper {}
#billboard-wrapper {}
#placard-wrapper {}
#main-wrapper {}
#supplement-wrapper {}
#appendix-wrapper {}
#rider-wrapper {}
#footer-wrapper {}

#header {}

.region {} // Target all regions/sections.
#topbar {}
#branding {
  padding-top: @size2;
  padding-bottom: @size2;
}
#header-annex {
  padding-top: @size2;
}
#navigation {}
#billboard{}
#placard {}
#highlighted{}
#help{}
#sidebar-first {}
#sidebar-second {}
#supplement {}
#appendix {}
#rider {}

nav#secondary-menu {}
#theme-attribution {}

#main-container {}

#main {}

#footer {}



#site-name {
  a:hover {
    color: @linkColor;
  }
}

// NAVIGATION LINKS
#main-menu,
#navigation {}

ul.menu {
  #topbar &,
  #main-menu &,
  #secondary-menu &,
  #navigation & {}
  #topbar & {}
}

// SEARCH
.search-results  {
  .search-url {
    color: @colorGreen;
  }
  .search-info {
    color: darken(@colorGreen, 50%);
  }
}

// VERTICAL TABS
.vertical-tab-button-error a {
  border: 1px solid @colorRed;
}

// NODES
.node {}

// BLOCKS
.block {}

#block-system-main {
  background: transparent;
}