body {
  font-family: 'Lato', sans-serif;
  font-size: 10pt;
}
.point {
  cursor: pointer;
}
h1 {
  font-size: 18pt;
  padding: 0 0 0 100px;
  /*text-align: center;*/
}

h2 {
  font-size: 10pt;
  /*text-align: center;*/
}
#container {
  width: 100%;
}
#searchDiv {
  /*text-align: center;*/
  /*padding: 0 0 0 100px;*/
  padding: 20px 0 20px 100px;
}
#searchInput {
  border: 0px;
  border-bottom: 1px solid black;
  min-width:250px;
  outline: none;

}
#svgCanvas {
  position: relative;
  /*width: auto;*/
  /*min-width: 530px;*/
  /*height: auto;*/
  margin-bottom: 50px;
  float: left;
}

svg {
  /*width: 100%;*/
  fill: blue;
}

#infoPanelFoto {
  /*padding: 5% 5% 5% 5%;*/
  margin-top: 15px;
  margin-left: 20px;
  width: 220px;
  height: 160px;
  float: left;
}
#infoPanelContent {
  padding-left: 20px;
  /*width: 60%;*/
  float: left;
}

#infoPanel {
  width: 40%;
  float: left;
}
.clear {
  clear: left;
}
.instrukcja {
  padding-top: 70px;

}
.instrukcja p {
  padding-left: 30px;
  max-width: 300px;
}
.instrukcja img {
  vertical-align: middle;
}
@media screen and (max-width: 500px) {
  h1 {
    text-align: center;
  }
  h2 {
    text-align: center;
  }
  #svgCanvas {
    width: 100%;
    text-align: center;
  }
  svg {
    margin-left: auto;
    margin-right: auto;
  }
  #infoPanel {
    width: 90%;
    float: left;

  }
  #infoPanelFoto {
    width: 220px;
    margin-left: auto;
    margin-right: auto;
    float: none;
  }
  #container {
    /*text-align: center;*/
    padding-left: 3px;
    padding-right: 3px;
  }
  h1 {
    font-size: 10pt;
    padding-left: 10px;
  }
  #searchDiv {
    padding-left: 10px;
    text-align: center;
    display: none;
  }
  .instrukcja p {
    display: none;
  }
  .instrukcja img {
    display: none;
  }

}
@media screen and (min-width: 980px) {
  #svgCanvas {
    margin-left: 50px;
  }

}
@media screen and (max-width: 720px) {
  .instrukcja {
    padding-top: 0px;
  }
  .instrukcja p {
    font-size: 10pt;
  }

}