/*
Theme Name: Legionella Edinburgh
Theme URI: https://www.legionellaedinburgh.com
Author: Legionella Edinburgh
Description: Recreation of the former "Vilio" theme. Classic theme using Bootstrap 3 markup, compatible with modern PHP and WordPress. Styling is based on the original main.css.
Version: 2.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: legionella-edinburgh
*/

/* ---------- TAGS (from original main.css) ---------- */
* { margin: 0; padding: 0; }
body {
  background-color: #ffffff;
  color: #000;
  font-weight: 400;
  line-height: 26px;
  font-size: 15px;
  font-family: 'Open Sans', Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
a { text-decoration: none; color: #515151; }
a:hover { text-decoration: underline; color: #000; }
h1, h2, h3 { margin: 0; }
p { margin: 0; margin-bottom: 0; padding: 0; }
img { vertical-align: top; max-width: 100%; height: auto; }
label { font-weight: 400; }
button:focus { outline: 0; }
ul li { list-style: none; }

.btn-outline {
  display: table;
  margin: 30px 0;
  padding: 8px 20px;
  font-size: 14px;
  color: #fff;
  border: solid 1px #fff;
  border-radius: 3px;
  width: auto;
}
.btn-outline:hover { background: #fff; color: #034eab; text-decoration: none; }

@media all and (min-width:1300px) {
  .content .row { padding: 30px 0; }
}

.panel-heading h4 { font-size: 16px !important; padding: 0 !important; }
.content h4 {
  font-size: 24px !important;
  font-weight: 600 !important;
  color: #034aa2 !important;
  clear: both;
  padding: 25px 0;
  display: block;
}

/* Bullet lists: add class "bullet-points" to a list in the editor (FontAwesome chevron replaced by a text chevron) */
.bullet-points li { position: relative; padding-left: 40px; }
.bullet-points li:before { content: "\203A"; color: #e32246; left: 20px; font-size: 20px; font-weight: 700; line-height: 26px; position: absolute; }

/* ---------- BASE ---------- */
.container-fluid { padding: 0; }
button.menu-trigger {
  position: relative; z-index: 4; display: none; width: 100%;
  padding: 15px 0 10px; text-align: center; border: 0;
  background-color: #fff; color: #000; font-size: 22px; line-height: 1;
  -webkit-transition: color 0.25s ease-in-out 0s; transition: color 0.25s ease-in-out 0s;
}
button.menu-trigger:hover { color: #0f3d90; }

.headline { width: 100%; background: #fff; }
.headline .headline-content { border-bottom: 1px solid #395d97; position: relative; }
.headline .main-menu { position: relative; z-index: 2; padding: 25px 0 24px; float: right; }
.headline .main-menu ul { margin: 0; list-style-type: none; float: right; }
.headline .main-menu ul li { position: relative; margin-right: 43px; float: left; text-transform: uppercase !important; }
.headline .main-menu ul li:hover { background: #e3e3e3; }
.headline .main-menu ul li a { color: #484848; font-size: 1em; }
.headline .main-menu #menu-primary-navigation > li:last-child { margin-right: 0; }
.headline .logo { z-index: 1000; position: absolute; left: 0; top: 0; }
.headline .logo a { color: #fff; }
.headline .logo img { max-width: none; }
.headline .logo .site-title { display: block; padding: 22px 0; font: 700 24px Roboto, Arial, sans-serif; color: #034eab; text-transform: uppercase; }

/* Dropdowns (Bootstrap 3 markup; styled like the original dark submenu) */
.headline .main-menu ul li .dropdown-menu {
  float: none; margin: 0; min-width: 150px; padding: 10px 0;
  background-color: #000; border: 0; border-radius: 0; box-shadow: none;
}
.headline .main-menu ul li .dropdown-menu li { float: none; width: 100%; margin: 0; padding: 0; }
.headline .main-menu ul li .dropdown-menu li:hover { background: #222; }
.headline .main-menu ul li .dropdown-menu li a { color: #fff; padding: 3px 20px; display: block; white-space: nowrap; }
.headline .main-menu ul li .dropdown-menu li a:hover { background: transparent; color: #fff; }
.headline .main-menu ul li .dropdown-menu .dropdown-menu { top: 0; left: 100%; }
.headline .main-menu .caret { margin-left: 2px; }
@media (min-width: 768px) {
  .headline .main-menu li.dropdown:hover > .dropdown-menu { display: block; }
}

/* Banner background image (centred 1920px image) */
.intro {
  position: absolute; top: 0; left: 0; z-index: -1;
  width: 100%; height: 564px; overflow: hidden;
  background: #034eab linear-gradient(135deg, #0c2748 0%, #034eab 100%);
}
.intro img { position: absolute; top: 0; left: 50%; margin-left: -960px; max-width: none; }

.cta { padding: 20px 0; background-color: #0c2748; text-align: center; font-size: 1.2em; color: #fff; }
.cta a { color: #fff; border: solid 1px #fff; padding: 5px 8px; margin-left: 5px; border-radius: 4px; font-size: 0.9em; }

.footer { background: #f2f2f2; padding-top: 30px; }
.footer li { list-style: none !important; }
.footer a { color: #000 !important; }
.footer-bottom { background: #ebebeb; padding: 15px 0; font-size: 0.85em; }

/* ---------- CONTENT ---------- */
.box-intro { position: relative; z-index: 1; margin-bottom: 40px; }
.box-intro .container { position: relative; z-index: 2; text-align: center; }
.box-intro h1 {
  margin-bottom: 35px; padding-top: 146px; text-transform: uppercase; color: #fff;
  font-weight: 700; font-family: 'Roboto', Arial, sans-serif; font-size: 2.9em;
}
.box-intro p.lead {
  width: 65%; margin: 0 auto 40px; line-height: 1.6em; color: #fff;
  font-weight: 300; font-family: 'Roboto', Arial, sans-serif; font-size: 1.9em;
}
.box-intro .opts { margin-bottom: 62px; }
.box-intro a.lnk {
  display: inline-block; margin: 0 10px; padding: 8px 24px 7px; border: 1px solid #fff;
  text-decoration: none; color: #fff; font-weight: 300; font-family: 'Roboto', Arial, sans-serif; font-size: 1.3em;
  border-radius: 2px; transition: background 0.25s ease-in-out 0s;
}
.box-intro a.lnk:hover { background-color: rgba(255, 255, 255, 0.2); }
.box-intro .services { border-bottom: 1px solid #e1e2e9; }
.box-intro .services section { position: relative; width: 100%; height: 185px; margin: 0 auto 42px; text-align: center; display: block; }
.box-intro .services section a { display: block; }
.box-intro .services section img { width: 100%; }

.services section { background: rgba(0,0,0,.25); }
.services section p {
  position: absolute; margin-bottom: 0 !important; bottom: 0; left: 0; right: 0; display: block;
  padding: 11px 11px; background-color: #1a1a1a; color: #fff; font-weight: 500;
  font-family: 'Roboto', Arial, sans-serif; font-size: 1.2em; transition: background 0.25s ease-in-out 0s;
}
.services section a:hover p { background-color: #0f3d90; }
.services section a:hover { text-decoration: none; }
.services section:after {
  position: absolute; bottom: -16px; left: 50%; width: 100%; height: 16px; margin-left: -135px;
  background: url('assets/img/intro-shadow.png') no-repeat 0 0; content: '';
}

.box-about { margin-bottom: 20px; }
.box-about .lead,
.box-about .entry-content > p:first-child { line-height: 28px; font-size: 17px; }
.box-about h2 { margin-bottom: 20px; color: #313131; font-weight: 300; font-family: 'Open Sans', Arial, sans-serif; font-size: 2.15em; }
.box-about p { margin-bottom: 25px; line-height: 1.95em; }
.box-about .entry-content > p:first-child { line-height: 28px; }

.box-news { margin-bottom: 20px; }
.box-news h2 { margin-bottom: 16px; color: #313131; font-weight: 300; font-family: 'Open Sans', Arial, sans-serif; font-size: 2.15em; }
.box-news .news-list { padding-bottom: 15px; }
.box-news section {
  margin-bottom: 10px; padding-bottom: 9px; padding-left: 38px; border-bottom: 1px solid #eaeaea;
  background: url('assets/img/date.jpg') no-repeat 0 4px; line-height: 1.3em;
}
.box-news section p { display: block; color: #35424a; font-weight: 700; margin-bottom: 0 !important; }

.box-request { margin-top: 4px; margin-bottom: 40px; overflow: hidden; border: 1px solid #d8dbed; border-radius: 5px; }
.box-request hgroup,
.box-request .hgroup {
  display: block; position: relative; z-index: 1; padding: 12px 20px 15px 68px;
  background: #0079c5; background: linear-gradient(to right, #0079c5 0%, #0f3d90 100%);
}
.box-request .hgroup h2 { color: #fff; font-weight: 700; font-family: 'Open Sans', Arial, sans-serif; font-size: 1.35em; margin: 0 !important; }
.box-request .hgroup h2:before {
  position: absolute; top: 15px; left: 25px; display: block; width: 32px; height: 29px;
  background: url('assets/img/request.png') no-repeat 0 0; content: '';
}
.box-request .hgroup p { color: #8fb4e3; font-size: 0.9em; }
.box-request .form {
  position: relative; z-index: 2; margin-top: -5px; padding: 14px; border-top: 1px solid #d8dbed;
  background-color: #fff; border-radius: 3px;
}
.box-request ul { list-style: none; }
.box-request .form-group { position: relative; margin-bottom: 5px; }
.box-request .form-group div input,
.box-request .form-group input[type=text],
.box-request .form-group input[type=tel],
.box-request .form-group input[type=email] {
  width: 100%; height: 37px; padding: 11px 12px 9px 40px; font-size: 0.9em; box-shadow: none; border: 1px solid #ccc;
}
.box-request .form-group textarea { width: 100%; padding: 11px 12px 9px 12px; font-size: 0.9em; resize: none; box-shadow: none; border: 1px solid #ccc; }
.box-request .form-group:before { position: absolute; top: 11px; left: 16px; width: 16px; height: 16px; background: url('assets/img/form.png') no-repeat 0 0; content: ''; }
.form-name:before { background-position: 0 0; }
.form-phone:before { width: 19px; background-position: -16px 0; }
.form-email:before { width: 17px; background-position: -35px 0; }
.form-message:before { display: none; }
.form-message textarea { padding-left: 12px; }
.box-request .gfield_checkbox { margin: 8px 0; }
.box-request .gfield_checkbox li { padding: 2px 0; line-height: 1.4em; }
.box-request .gfield_checkbox input { margin-right: 6px; }
.box-request .gfield_checkbox label { font-size: 13px; }
.gfield_label { display: none; }
.gfield_required { color: #c0392b; margin-left: 2px; }
.gform_wrapper .gform_footer { padding-top: 8px; }
.gform_wrapper .gform_footer input.button,
.gform_wrapper .gform_footer input[type=submit],
.le-callback input[type=submit] {
  display: table; padding: 8px 20px; font-size: 14px; background: #034eab; color: #fff; border: none; border-radius: 3px; width: auto; cursor: pointer;
}
.gform_wrapper .gform_footer input[type=submit]:hover,
.le-callback input[type=submit]:hover { background: #0f3d90; }
.le-hp { position: absolute; left: -9999px; height: 0; overflow: hidden; }
.le-notice { padding: 10px 12px; margin: 0 0 12px; line-height: 1.5em; }
.le-ok { background: #e6f4ea; border-left: 4px solid #2e7d32; }
.le-err { background: #fdecea; border-left: 4px solid #c0392b; }
.gform_confirmation_message, .validation_error { padding: 10px 12px; background: #f2f6fb; border-left: 4px solid #034eab; margin-bottom: 12px; }

.blue-section { background: url('assets/img/map.jpg') no-repeat right top; background-color: #034eab; color: #fff; padding: 30px 0; }
.blue-section a { color: #fff; }
.box-info { margin-bottom: 20px; }
.box-info h2 { margin-bottom: 20px; padding-top: 45px; background-repeat: no-repeat; background-position: 0 0; line-height: 1.4em; color: #fff; font-weight: 300; font-size: 1.6em; }
.box-info h2 strong { display: block; font-weight: 900; font-size: 1.3em; }
.box-info p { margin-bottom: 25px; line-height: 1.95em; font-size: 1.0em; }
.box-info .list { padding-right: 100px; }
.box-info .list ul { width: 50%; margin: 20px 0; float: left; list-style-type: none; }
.box-info .list ul li { padding-bottom: 10px; padding-left: 42px; line-height: 1.95em; font-size: 0.9em; font-weight: 800; }

.box-page { margin-bottom: 40px; }
.box-social { margin-bottom: 20px; }

.subpage-slider { position: relative; margin-bottom: 50px; }
.subpage-slider .services section { width: 270px; position: relative; height: 190px !important; }
.subpage-slider .services { margin-top: 130px; }
.subpage-slider .intro { height: 276px !important; }
footer h3 { padding-bottom: 20px; }
footer ul li { padding-bottom: 10px; }

.empty { clear: both; }
.none { display: none; }
.mr80 { margin-right: 80px; }
a.more {
  display: inline-block; padding: 6px 13px 7px; border: 1px solid #034eab; text-decoration: none; color: #034eab;
  font-weight: 400; font-size: 0.9em; border-radius: 3px; transition: all 0.25s ease-in-out 0s;
}
a.more:hover { background: #034eab; color: #fff; }

.about-section .lead { font-size: 17px !important; line-height: 28px !important; }
.whyus ul li { position: relative; }
.whyus ul li:before { font-size: 14px; color: yellow; content: '\2713'; font-weight: 700; position: absolute; top: 0; left: 0; }

/* ---------- RESPONSIVE (from original) ---------- */
@media screen and (min-width: 320px) and (max-width: 767px) {
  button.menu-trigger { display: block; }
  .headline { position: relative; }
  .headline .main-menu { margin: 0 -15px; padding: 0 15px; float: none; background-color: #142c59; }
  .headline .main-menu ul { padding: 20px 0 50px; width: 100%; }
  .headline .main-menu ul li { margin: 0; padding-bottom: 30px; font-size: 16px; text-align: center; float: none; width: 100%; }
  .headline .main-menu ul li:hover { background: transparent; }
  .headline .main-menu ul li a { text-transform: capitalize !important; color: #fff; }
  .headline .main-menu .caret { display: none; }
  .headline .main-menu ul li .dropdown-menu {
    position: static; display: block !important; opacity: 1 !important; padding: 0 15px; background: transparent; float: none;
  }
  .headline .main-menu ul li .dropdown-menu li { margin: 0; padding: 10px 0 0 0; }
  .headline .main-menu ul li .dropdown-menu li:hover { background: transparent; }
  .headline .main-menu ul li .dropdown-menu .dropdown-menu { left: auto; }
  .headline .logo { float: none; text-align: center; }
  .box-intro { margin-top: -72px; }
  .box-intro a { cursor: pointer; }
  .box-intro p.lead { width: auto; font-size: 1.3em !important; }
  .box-intro .services section { width: 270px; }
  .box-intro .services { padding-top: 50px; }
  .box-info .list ul { width: auto; float: none; }
  .box-info .list { padding-right: 0; }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .box-intro .services section { width: 270px; }
  .subpage-slider .services section { width: 270px; }
}
@media screen and (min-width: 992px) and (max-width: 1199px) {
  .box-intro .services section { width: 270px; }
}
@media screen and (min-width: 768px) {
  .headline .main-menu.collapse { display: block !important; visibility: visible !important; }
}

/* ---------- WordPress extras (not in the original theme) ---------- */
.alignleft { float: left; margin: 0 20px 15px 0; }
.alignright { float: right; margin: 0 0 15px 20px; }
.aligncenter { display: block; margin: 0 auto 15px; }
.wp-caption { max-width: 100%; }
.wp-caption-text, .gallery-caption { font-size: 13px; color: #777; }
.screen-reader-text { position: absolute; left: -9999px; }
.wrap.container { padding-bottom: 20px; }
.entry { margin-bottom: 35px; }
.entry-date { color: #888; font-size: 13px; }
.sidebar .widget { margin-bottom: 25px; }
.nav-links, .pagination { margin: 20px 0; }
.wp-block-button__link { background: #034eab; color: #fff; padding: 8px 20px; border-radius: 3px; }