/*buttons*/
.button {
  margin: auto;
}

.button.sm-hide, .row.sm-hide, div.sm-hide {
  display: none;
}

@media only screen and (min-width: 768px) {
  .button.sm-hide  {
    display: table;
  }

  .row.sm-hide, div.sm-hide {
    display: block;
  }
}

.row.sm-show, .matterprompt.sm-show,  div.sm-show{
  display: block;
}

@media only screen and (min-width: 768px) {
  .row.sm-show, .matterprompt.sm-show {
    display: none;
  }
}

.row.sm-show h2 {
  text-align: left;
}

#page-5 .row.sm-show h2, #page-6 .row.sm-show h2 {
  text-align: center;
}

.row.sm-show p {
 margin-top: 0;
}

.row.sm-show a {

  font-size: 12px;
  padding-left: 12px;
  color: black;
}

@media only screen and (min-width: 520px) {
  .row.sm-show a {

  font-size: 20px;
  padding-left: 12px;
 }

}


div#who-officer p {
  padding: 0;
}

div#who-officer p i {
  margin-bottom: 10em;
}

.table-b {
  font-weight: bold;
}

div.md-3.float-left div:hover {
    background: #262626;
  }

[data-pt-page="saving"] div.sm-6.float-left div:hover {
    background: rgba(11,68,107,0.5);
}

[data-pt-page="support"] div.md-3.float-left div:hover {
    background: rgba(156,110,79,0.5);
}

[data-pt-page="who"] div.md-3.float-left div:hover {
    background: rgba(162,186,207,0.5);
}


[data-pt-page="financials"] div.sm-6.float-left div:hover {
    background: rgba(109,163,23,0.5);
}

/*bottm nav*/
.fa.fa-angle-right, .fa.fa-angle-left {
  font-weight: bold;
  font-size: 1.4em;
}

/*credits*/
div.credits {
  height: 20px;
  line-height: 0px;
  padding: 0;
  background-color: #555;
  color: #fff;
  text-align: center;
  font-size: 0.5em;
}

div.credits a {
  color: #fff;
}

div.columns.md-6.chart {
  padding-right: 0;
}


div.md-3.float-left div:hover a, div.sm-6.float-left div:hover a {
    color:#fff;
  }

[data-pt-page=who] div.matter h2 {
  padding-top: 0;
} 

[data-pt-page=who] div.to-top  {
  margin-top: 1em;
  margin-bottom: 0;
}

[data-pt-page=support] div.intro {
  padding: 0;
  margin-bottom: 0;
}

[data-pt-page=support] h2 {
  margin-top: 1em;
}

[data-pt-page=support] div.to-top  {
  margin-top: 1.5em;
  margin-bottom: 0;
}

[data-pt-page=support] div.line {
  margin-top: 1.5em;
  margin-bottom: 1.5em;
}

/*map*/

div#interactivemap {
  position: absolute;
  left: 0;
  top: 0;
  width:100%;
  height: 100%;
  overflow: hidden;
}

@media only screen and (max-height: 600px) {
  div#interactivemap  {
    top: -2000;
  }
}


div.tooltip {
  text-align: left;
  position: absolute;
  font-size: 10pt;
  font-family: helvetica, sans-serif;
  font-weight: lighter;
  line-height: 12pt;
  padding: 6px;
  background-color: rgba(255, 255, 255, 1);
  border-style: solid;
  border-width: 2px;
  border-color: #27A5D2;
  color: black;
  width: 140px;
}

.hidden { 
  display: none; 
}

section#page-3 a.fa.fa-angle-right.map-arrow, section#page-3 a.fa.fa-angle-left.map-arrow {
  font-weight: bold;
  font-size: 6.5em;
}

@media only screen and (max-width: 640px) {
  section#page-3 a.fa.fa-angle-right.map-arrow, section#page-3 a.fa.fa-angle-left.map-arrow {
    font-size: 4.5em;
    top: 45%;
  }
}

a.map-arrow {
  position: absolute;
  top: 42%;
  vertical-align: middle;
  text-align: center;
  color: black;
  z-index:4;
  font-weight: bold;
  font-size: 6.5em;
}

a.map-arrow:hover {
  color: #27A5D2;
}

a.map-arrow.fa-angle-left {
  left: 7%;
}

a.map-arrow.fa-angle-right {
  right: 7%;
}

#svg-head {
  pointer-events: none;
  cursor: none;
  font-size: 2.3em;
  font-weight: bold;
  text-anchor: middle;
  cursor: none;
}

#svg-subhead {
  pointer-events: none;
  cursor: none;
  font-size: 1em;
  font-weight: bold;
  text-anchor: middle;
}

@media only screen and (max-width: 640px) {
    #svg-head {
      font-size: 1.65em;
      line-height: 1.17em;
    }

    #svg-subhead {
      font-size:  0.35em;
      line-height:  1.2em;
    }

}

#s {
  min-height: 1200;
}

[data-pt-page=financials] div.contenttags-container {
  width: 80%;
}

@media only screen and (min-width: 640px) {
 [data-pt-page=financials] div.contenttags-container {
    width: 40%;
  }
}

    [data-pt-page=saving] div.button {
    width: 60%;
    height: 60px;
   }

    [data-pt-page=financials] div.button {
      width: 60%;
      height: 60px;
      width: 40%;

    }

   @media only screen and (min-width: 640px) {
    [data-pt-page=financials] div.button {
      width: 80%;
     }

     [data-pt-page=saving] div.button {
        width: 40%;
     }
   }