/* ===== Bas / typografi ===== */
html, body { height: 100%; }
body {
  font-family: "Oswald", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #222;
  line-height: 1.55;
}
img { max-width: 100%; height: auto; display: block; }

/* ===== Navbar ===== */
.navbar-inverse { background:#111; border-color:#111; }
.navbar { min-height: 54px; }
.navbar-header { position: relative; }
.navbar-brand {
  display:flex; align-items:center;
  padding: 8px 15px;
}
.navbar-brand img {
  height:36px; width:auto; display:inline-block;
}
.brand-tagline {
  font-size:14px; font-weight:600; color:#d9d9d9;
  margin-left:8px; white-space:nowrap;
}

.navbar-toggle { float:right; margin-right:0; }
.navbar-inverse .navbar-nav>li>a,
.navbar-inverse .navbar-brand { color:#9d9d9d; }
.navbar-inverse .navbar-nav>.active>a,
.navbar-inverse .navbar-nav>.active>a:focus,
.navbar-inverse .navbar-nav>.active>a:hover { color:#fff; background:#080808; }

/* ===== Sidan under nav ===== */
.page-container { padding-top: 70px; } /* pga fixed-top */
.hero-img { margin-bottom:16px; }

/* ===== Jumbotron mjuk stil ===== */
.jumbotron-soft {
  background:#eee;
  border-radius:6px;
  padding:20px;
  margin-bottom:24px;
}

/* ===== Sektionstitel ===== */
.section-title { margin:20px 0 12px; }

/* ===== Tjänster (mobilvänlig lista) ===== */
.services { list-style:none; padding:0; margin:0; }
.service { display:flex; align-items:flex-start; margin-bottom:18px; }
.icon-badge {
  flex: 0 0 44px; height:44px; width:44px;
  border-radius: 50%;
  background:#111; color:#fff;
  display:inline-flex; align-items:center; justify-content:center;
  margin-right:12px;
}
.icon-badge .glyphicon { font-size:20px; line-height:1; }
.service-body h3 { margin:0 0 6px; font-size:20px; }

/* ===== Tidsbokning (sidokolumn) ===== */
.tidsbokning {
  color:#fff; background:#428bca; padding:12px;
}
.tidsbokning a { color:#fff; text-decoration:underline; }
.contact-table { width:100%; font-size:17px; }
.contact-table td { padding:6px 6px; vertical-align:top; }
.contact-table .glyphicon { margin-right:6px; }

/* ===== Facebook-widget responsiv ===== */
.fb-page, .fb_iframe_widget, .fb_iframe_widget span, .fb_iframe_widget iframe {
  width:100% !important; max-width:100% !important;
}

/* ===== Footer ===== */
#footer {
  background: #000;
  color: #fff;
  padding: 30px 0;
  margin-top: 40px;
  font-size: 16px;
}

#footer a { color: #fff; text-decoration: none; }
#footer a:hover { color: #d5d5d5; text-decoration: underline; }

.footer-flex {
  display: flex;
  justify-content: space-between;  /* text till vänster, logga till höger */
  align-items: flex-start;
  gap: 20px;
  flex-wrap: wrap;                 /* så det bryter snyggt på mobil */
}

.footer-info h4 {
  margin: 0 0 5px;
  font-size: 20px;
}

.footer-info p {
  margin: 6px 0;
}

.footer-info .glyphicon {
  margin-right: 8px;
  font-size: 16px;
  vertical-align: middle;
}

.footer-logo img {
  max-height: 50px;
  width: auto;
  display: block;
}
 #footer .glyphicon { color:#2e7d32; } 

 /* IOSOFT BAR*/
 .iosoft {
  background-color: darkgrey;
  color: black;
  text-align: center;
  padding: .5rem;
 }

/* ===== Responsivitet ===== */
@media (min-width: 992px) {
  .service-body h3 { font-size:22px; }
  .jumbotron-soft { padding:26px; }
  .hero-img { margin-bottom:22px; }
}

@media (max-width: 767px) {
  .navbar-brand img { height:32px; }
  .brand-tagline { font-size:13px; }
  .jumbotron-soft { padding:18px; }
}