/*
Theme Name: Native Land Theme
Theme URI: https://native-land.ca/
Author: Victor Gerard Temprano
Author URI: http://victortemprano.com/
Description: The default theme for Native-Land.ca. Includes a ReactJS app for the front page.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: nativeland
*/

body {
  /* padding-bottom: 20px; */
}

/* Header Styles */

header #logo {
  width:100%;
  height:100px;
  text-align:center;
  padding:15px;
}
header #logo img {
  height:100%;
  width:auto;
}

#social-icons img {
  width:30px;
  margin:5px;
}
.how-it-works-row a {
  color : #FFFFFF;
}
.how-it-works-row a:hover {
  text-decoration: none;
}
.how-it-works-row .tile {
  display: table;
  margin: 0 auto;
  text-align: center;
  padding: 20px;
  border: thin black solid;
  border-radius: 10px;
  box-shadow: 2px 2px 10px #ccc;
  background: #eee;
  width: 200px;
}

.footer-style {
  background: rgba(53, 68, 88, 0.8);
  color: #eee;
  padding-bottom: 40px;
}
.footer-style h5, .footer-style a {
  color: white;
}
.footer-style .text-muted {
  color: #ccc !important;
}

.footer-copyright {
  text-align:  center;
}

/* This is to allow the Bootstrap navbar to be centered */

@media screen and (min-width: 767px) {
  .navbar-center .nav-center, .navbar-center .nav-center > li {
      float:none;
      display:inline-block;
      *display:inline;
      /* ie7 fix */
      *zoom:1;
      /* hasLayout ie7 trigger */
      vertical-align: top;
  }
  .navbar-center-inner {
      text-align:center;
  }
}

/* */

@media (min-width:768px) {
  .sub-menu {
    display: none;
    position: absolute;
    background: #222;
    padding: 10px 15px;
    width: 200px;
  }

  li:hover .sub-menu {
    display: block;
  }

}

.sub-menu li {
  margin-bottom: 10px;
  list-style: none;
}

.sub-menu li:last-child {
  margin-bottom: 0;
}

.sub-menu a  {
  color: #999;
  text-decoration: none;
}

.sub-menu a:hover  {
  color: #fff;
}

/* Menu styles */

.current-menu-item > a, .current-menu-parent > a {
  background: #f9f9f9;
}
.current-menu-parent li a {
  background: inherit;
}
.current-menu-parent .current-menu-item a {
  color: #fff;
  font-weight: bold;
}

.sidebar {
  margin-top: 40px;
}

.featured-image img {
  max-width: 100%;
}

/*
 * Off Canvas
 * --------------------------------------------------
 */
@media screen and (max-width: 767px) {
  .row-offcanvas {
    position: relative;
    -webkit-transition: all .25s ease-out;
         -o-transition: all .25s ease-out;
            transition: all .25s ease-out;
  }

  .row-offcanvas-right {
    right: 0;
  }

  .row-offcanvas-left {
    left: 0;
  }

  .row-offcanvas-right
  .sidebar-offcanvas {
    right: -50%; /* 6 columns */
  }

  .row-offcanvas-left
  .sidebar-offcanvas {
    left: -50%; /* 6 columns */
  }

  .row-offcanvas-right.active {
    right: 50%; /* 6 columns */
  }

  .row-offcanvas-left.active {
    left: 50%; /* 6 columns */
  }

  .sidebar-offcanvas {
    position: absolute;
    top: 0;
    width: 50%; /* 6 columns */
  }
}


/* =Theme customization starts here
-------------------------------------------------------------- */
body.home {
  padding:0;
}
.mapboxgl-ctrl-geocoder {
  margin-left: 0px;
}
blockquote {
  font-size: 14px;
  background: #eee;
  padding: 20px;
}
/* table td {
  border: inset;
  padding: 10px;
  margin-bottom: 15px;
} */
/* customizing bootstrap */
.native-land-nav {
  background: rgba(53, 68, 88, 0.8);
  box-shadow: 0 2px 5px -2px gray;
  padding: 0rem 1rem;
  z-index: 10000000;
}
#entrance_modal {
  z-index: 100000000;
}
.native-land-nav .navbar-brand, .native-land-nav .navbar-nav>li>a {
  color: white;
  cursor: pointer;
}
.native-land-nav .navbar-brand:hover, .native-land-nav .navbar-nav>li>a:hover {
  color: #eee;
}
.current-menu-item > a, .current-menu-parent > a {
  background: #858e9a;
}
@media(min-width:768px){
  #bs4navbar .dropdown-menu.show {
    margin-left: -80px;
  }
}
@media(max-width:768px){
  .native-land-nav {
    background: rgba(53, 68, 88, 1);
  }
  #bs4navbar .menu-item > a {
    margin-left: -15px;
    margin-right: -15px;
    padding-left: 15px;
  }
}

.jumbotron {
  padding: 2rem;
}
/* mapbox styles */

.mapboxgl-popup-content {
  padding: 5px;
}
.mapboxgl-popup-content p {
  margin: 0;
  padding: 0;
}
.advanced-button {
  position: absolute;
  margin-left: 150px;
  background: white;
  margin-top: -12px;
  padding: 5px;
  width: 100px;
  z-index: 1000;
  font-size: 12px;
  border-top: none;
}
.results-overlay {
  display: inline-block;
  width: auto;
}
.placenames, .colors {
  position: absolute;
  bottom: 0;
  right: 0;
  /* z-index: 1000; */
  margin-bottom: 29px;
  margin-right: 50px;
  /* border: thin grey solid; */
  box-shadow: #aaa 1px 1px 3px;
}
.colors {
  margin-right: 190px;
}
.placenames {
  z-index :100000;
}
.placenames .dropdown-menu {
  margin-left: -65px;
}
.map-overlay {
    font: 12px/20px 'Helvetica Neue', Arial, Helvetica, sans-serif;
    position: absolute;
    width: 20%;
    z-index: 1000000;
    min-width:200px;
    top: 0;
    left: 0;
    margin-top: 40px;
    padding: 10px;
}

.map-overlay .map-overlay-inner {
    width: 260px;
    background-color: #fff;
    box-shadow:0 1px 2px rgba(0, 0, 0, 0.20);
    border-radius: 3px;
    padding: 10px;
    margin-bottom: 10px;
    line-height: 16px;
}

.map-overlay h2 {
    line-height: 24px;
    display: block;
    margin: 0 0 10px;
}

.map-overlay .legend .bar {
    height: 10px;
    width: 100%;
    background: linear-gradient(to right, #FCA107, #7F3121);
}

.map-overlay input {
    background-color: transparent;
    display: inline-block;
    /*width: 100%;*/
    position: relative;
    margin: 0;
    /*cursor: ew-resize;*/
}
.leaflet-control {
  float: none;
}

.leaflet-control-mapbox-geocoder {
  margin-left: -5px;
  display: none;
}
.leaflet-control-mapbox-geocoder.active .leaflet-control-mapbox-geocoder-wrap {
  width: 85%;
}
.leaflet-control-mapbox-geocoder .leaflet-control-mapbox-geocoder-form input {
  width: 100%;
}
.leaflet-control-mapbox-geocoder.active .leaflet-control-mapbox-geocoder-results {
  border: none;
}
.leaflet-control-mapbox-geocoder.active, .leaflet-control-mapbox-geocoder.active .leaflet-control-mapbox-geocoder-toggle {
  border: none;
}
.mapbox-improve-map {
    display: none;
}

/* bootstrap select */
.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
  width: 100%;
}
.dropdown-menu.open {
  z-index: 100000 !important;
}
/*
Make bootstrap-select work with bootstrap 4 see:
https://github.com/silviomoreto/bootstrap-select/issues/1135
*/
.dropdown-toggle.btn-default {
  color: #292b2c;
  background-color: #fff;
  border-color: #ccc;
}
.bootstrap-select.show > .dropdown-menu > .dropdown-menu {
  display: block;
}
.bootstrap-select > .dropdown-menu > .dropdown-menu li.hidden {
  display: none;
}
.bootstrap-select > .dropdown-menu > .dropdown-menu li a {
  display: block;
  width: 100%;
  padding: 3px 1.5rem;
  clear: both;
  font-weight: 400;
  color: #292b2c;
  text-align: inherit;
  white-space: nowrap;
  background: 0 0;
  border: 0;
  text-decoration: none;
}
.bootstrap-select > .dropdown-menu > .dropdown-menu li a:hover {
  background-color: #f4f4f4;
}
.bootstrap-select > .dropdown-toggle {
  width: 100%;
}
.dropdown-menu > li.active > a {
  color: #fff !important;
  background-color: #337ab7 !important;
}
.bootstrap-select .check-mark {
  line-height: 14px;
}
.bootstrap-select .check-mark::after {
  font-family: "FontAwesome";
  content: "\f00c";
}
.bootstrap-select button {
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Make filled out selects be the same size as empty selects */
.bootstrap-select.btn-group .dropdown-toggle .filter-option {
  display: inline !important;
}

.alignleft {
  float: left;
  margin-right: 10px;
  margin-bottom: 10px;
}
.alignright {
  float: right;
  margin-left: 10px;
  margin-bottom: 10px;
}
.togglers {
  margin-bottom: 10px;
}
.togglers .focus {
  border: none;
}
.togglers .btn {
  cursor: pointer;
  box-shadow: none;
}
.togglers .toggle-on {
  color: #fff;
  background-color: #428bca;
  border-color: #428bca;
}
.togglers > .btn {
border-color: #adadad !important;
}
.togglers .toggle-off {
  color: #333 !important;
  background-color: #e6e6e6 !important;
  border-color: #adadad !important;
  box-shadow: inset 0 3px 5px rgba(0,0,0,.125) !important;
  padding-left: 15px !important;
}
.togglers .toggle-handle {
  background: #FFF;
  border-color: #adadad;
}

.selectors select {
    padding:3px;
    margin: 0;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    border-radius:4px;
    -webkit-box-shadow:
        0 3px 0 #ccc,
        0 -1px #fff inset;
    -moz-box-shadow:
        0 3px 0 #ccc,
        0 -1px #fff inset;
    box-shadow:
        0 3px 0 #ccc,
        0 -1px #fff inset;
    background: #f8f8f8;
    color:#888;
    border:none;
    outline:none;
    display: inline-block;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    cursor:pointer;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
    .selectors select {padding-right:18px}
}
.selectors label {position:relative}
.selectors label:after {
    content:'<>';
    font:11px "Consolas", monospace;
    color:#aaa;
    -webkit-transform:rotate(90deg);
    -moz-transform:rotate(90deg);
    -ms-transform:rotate(90deg);
    transform:rotate(90deg);
    right:4px; top:2px;
    padding:0 0 2px;
    border-bottom:1px solid #ddd;
    position:absolute;
    pointer-events:none;
}
.selectors label:before {
    content:'';
    right:4px; top:0px;
    width:20px; height:20px;
    background:#f8f8f8;
    position:absolute;
    pointer-events:none;
    display:block;
}

.initialHide {
  display: none !important;
}

.mapboxgl-popup {
  pointer-events: auto !important;
}

[role=button], a, area, button, input:not([type=range]), label, select, summary, textarea {
  touch-action: manipulation;
}

.leaflet-popup-tip {
  width: 8px;
  height: 8px;
}
.leaflet-popup-content {
  padding: 0;
  margin: 0;
}
.leaflet-popup-close-button+.leaflet-popup-content-wrapper .leaflet-popup-content {
  padding:3px 5px;
}
.leaflet-popup-content-wrapper {
  border-radius: 0px;
}
.leaflet-popup-content-wrapper, .leaflet-popup-tip {
  background:rgba(255,255,255,0.9);
}
.color-swatch {
  width: 8px;
  border-radius: 10px;
  display:inline-block;
  margin-right: 5px;
  height: 8px;
}
.leaflet-control-mapbox-geocoder-results a {
  width: 100% !important;
  text-align: left;
}
.leaflet-popup-content p {
  padding: 0;
  margin: 0;
  font-size: 10px;
}
.leaflet-popup {
  pointer-events: auto;
}

.pac-container {
    z-index: 10000000 !important;
}

.swpm-subscription-button-submit {
	background: white;
    padding: 5px 10px;
    border: none;
    box-shadow: 1px 1px 1px #333;
    border-radius: 10px;
    margin-bottom: 10px;
    margin-top: -5px;
	cursor: pointer;
}
.swpm-subscription-button-submit:hover {
	background: #efefef;
}

#bitnami-banner, .grecaptcha-badge {
  display: none !important;
}
