/* 
    usage:...
    
    @include for-desktop-up {

.header {
    grid-area: header;
    background-color: blue;
}


  }
*/
body {
  background-color: white;
  font-family: "Proxima Nova","-apple-system","BlinkMacSystemFont","Segoe UI","Roboto",Arial,sans-serif;
  color: #333; }

.container {
  display: grid;
  width: 100%;
  height: auto;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: 100px 50px 0px auto auto;
  /*   grid-template-areas:
      "header header header header header header header header header header header header"
      "nav nav nav nav nav nav nav nav nav nav nav nav"
      "hero hero hero hero hero hero hero hero hero hero hero hero"
      "main main main main main main main main main main main main"
      "footer footer footer footer footer footer footer footer footer footer footer footer";
      */ }

.header {
  grid-row: 1;
  grid-column-start: 1;
  grid-column-end: 13;
  background-color: #555555;
  display: grid;
  grid-template-columns: repeat(12, 1fr); }

.header-inner {
  grid-column-start: 1;
  grid-column-end: 13;
  grid-row: 1;
  text-align: center; }

.logo {
  width: 195px;
  margin-top: 12px;
  border: 0; }

.nav {
  grid-row: 2;
  grid-column-start: 1;
  grid-column-end: 13;
  display: grid;
  grid-template-columns: repeat(12, 1fr); }

.nav-inner {
  margin-top: auto;
  margin-bottom: auto;
  grid-column-start: 10;
  grid-column-end: 12;
  grid-row: 1;
  text-align: center; }

.hero {
  grid-row: 3;
  grid-column-start: 1;
  grid-column-end: 13; }

.main {
  grid-row: 4;
  grid-column-start: 1;
  grid-column-end: 13;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: auto auto;
  margin-bottom: 25px; }

.main-inner {
  grid-column-start: 3;
  grid-column-end: 11;
  grid-row: 1;
  text-align: left;
  border-bottom: #efefef 2px solid; }

.center {
  text-align: center; }

.map {
  margin-top: 35px;
  grid-column-start: 4;
  grid-column-end: 11;
  grid-row: 2; }

.map iframe {
  width: 45%;
  height: 350px;
  float: left;
  border: 0; }

.map-div {
  margin-top: -20px;
  padding-left: 20px;
  width: 45%;
  height: auto;
  float: left; }

.map-button {
  text-decoration: none;
  border: 1px solid #b3b2b2;
  padding: 7px 7px;
  font-size: 13px;
  color: #333333;
  font-weight: bold;
  border-radius: 3px; }

.map-button:hover {
  background-color: #f2f2f2; }

@media (max-width: 599px) {
  .main {
    grid-template-rows: auto auto auto; }

  .main-inner {
    grid-column-start: 1;
    grid-column-end: 13; }

  .map {
    grid-column-start: 1;
    grid-column-end: 13;
    grid-row: 2;
    text-align: center; }

  .map iframe {
    width: 100%;
    height: 350px;
    display: block;
    border: 0; }

  .map-div {
    width: 100%;
    height: auto;
    text-align: center;
    padding-left: 0; } }
.footer {
  clear: left;
  grid-row: 5;
  grid-column-start: 1;
  grid-column-end: 13;
  background-color: #efefef;
  text-align: center;
  min-height: 75px;
  padding-top: 20px;
  font-size: 12px; }

.footer a {
  text-decoration: none;
  color: #217fc8; }

.ec-breadcrumbs {
  display: none !important; }

div.ecwid-productBrowser-backgroundedPanel {
  background-color: #ededed !important; }

.ecwid-btn--primary {
  background: #333 !important;
  color: #fff !important; }

div.ecwid-minicart {
  display: none !important; }

div.ecwid-productBrowser-nav {
  display: none; }

div.ecwid-productBrowser-price {
  color: #333 !important; }

div.ecwid-productBrowser-cart-totalAmount {
  color: #333 !important; }
