@font-face {
  font-family: 'National';
  src: url('fonts/National-Light.woff');
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: 'National';
  src: url('fonts/National-Thin.woff');
  font-weight: 100;
  font-style: normal;
}
@font-face {
  font-family: 'National';
  src: url('fonts/National-Regular.woff');
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: 'National';
  src: url('fonts/National-Black.woff');
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: 'National';
  src: url('fonts/National-Bold.woff');
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: 'Tiempos';
  src: url('fonts/TiemposText-Regular.woff');
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: 'ProximaNovaCond';
  src: url('fonts/ProximaNovaCond-Bold.otf');
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: 'ProximaNovaCond';
  src: url('fonts/ProximaNovaCond-Regular.otf');
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: 'Georgia';
  src: URL('fonts/Georgia-Bold-Italic.ttf') format('truetype');
  font-weight:500;
  font-style: italic;
}
@font-face {
  font-family: 'Georgia';
  src: URL('fonts/Georgia-Italic.ttf') format('truetype');
  font-weight:300;
  font-style: italic;
}
body, html {
  font-family: 'National'
}
#container {
  display:flex;
  flex-direction: vertical;
  max-height:464px;
  max-width:640px;
}
#map {
  height:308px;
}
@media only screen and (max-width: 640px) {
  #right-container {
    opacity:0;
  }
}
h1 {
  font-size:20px;
  line-height:34px;
  margin:0 auto 0 10px;
  text-align:left;
}
p {
  font-family:'Tiempos';
}
.description-text {
  font-family:Georgia;
  font-weight:300;
  font-size:12px!important;
  line-height:14px;
  margin:0 auto 10px 10px;
  text-align:left;
}
#search-container {
  position: relative;
  margin:10px 2px 5px 2px;
}

#search {
  width:100%;
}
#search, #search-button {
  position: absolute;
  top: 0;
}
#search-button {
  background-color: #667CA6;
  right:3px;
  width: 14%;
  z-index:10;
}
#right-container {
  font-family: ProximaNovaCond;
  font-size:16px;
  font-weight:500;
  padding: 5px 8px 0 0;
  margin:10px 10px 0 10px;
  text-align:justify;
  width:160px;
  min-width:151.3px!important;
}
#right-container p {
}
#footer {
  font-style: italic;
  margin-top:5px;
}
#key {
  font-family: ProximaNovaCond;
  font-size:16px;
  font-weight:500;
  line-height: 20px;
  margin-left:6px;
}
.flexy svg {
  padding:auto 0;
  margin:auto 0;
}
.flexy {
  justify-content: space-around;
  display:flex;
  margin:2px 0 8px 0;
}
.desc {
  font-size:10px!important;
  font-style: italic;
  margin-bottom: 4px;
}
.bottom-pane {
  height: 156px;
  display:flex;
}