/*
 * Base rules for the escritorio app page, which no longer loads the parent
 * theme's stylesheets. These are the few rules from wp-bootstrap-starter's
 * style.css and its "montserrat-merriweather" typography preset that the app
 * actually relied on; Bootstrap itself (Bootswatch Cosmo) is in
 * assets/vendor/bootstrap/. Loaded before the theme's style.css.
 */

header#masthead {
  margin-bottom: 0;
  padding: .74rem 1rem;
}

.navbar-brand {
  height: auto;
  padding-top: .25rem;
}

.navbar-brand > a {
  color: #fff;
  font-size: 1.1rem;
  font-weight: 700;
  outline: medium none;
  text-decoration: none;
  text-transform: uppercase;
}

.navbar-brand > a:visited,
.navbar-brand > a:hover {
  text-decoration: none;
}

h1 {
  padding-bottom: 10px;
}

h2 {
  padding-bottom: .3em;
}

.entry-content {
  margin: 1.5em 0 0;
}

/* Clearfix: also keeps child margins inside these boxes. */
.entry-content:before,
.entry-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
  content: "";
  display: table;
  table-layout: fixed;
}

.entry-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
  clear: both;
}

footer#colophon {
  font-size: 85%;
}

.navbar-dark .site-info {
  color: #fff;
}

footer#colophon a {
  color: inherit;
}

/* Everything sized in rem shrinks on smaller screens. */
@media only screen and (max-width: 1280px) {
  html { font-size: 95%; }
}

@media only screen and (max-width: 1024px) {
  html { font-size: 90%; }
}

@media only screen and (max-width: 960px) {
  html { font-size: 85%; }
}

@media only screen and (max-width: 768px) {
  html { font-size: 80%; }
}

@media only screen and (max-width: 480px) {
  html { font-size: 75%; }
}