body, html {
  background-color: white;
  margin: 0;
  padding: 0;
  height: auto;
  scroll-behavior: smooth;
}

.scrollbar-hidden::-webkit-scrollbar {
  display: none;
}
.scrollbar-hidden {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.pasek {
  height:7vh;
  width:60%;
  border-bottom: 1px solid black;
  border-radius: 0.5px;
  background-color: white;
  position:fixed;
  top:0;
}
.left {
  display:flex;
  margin: 0 auto;
  margin-top:10vh;
}

.logo img {
  height:80%;
  margin-left:30%;
  margin-top:7.5%;
}
.left a {
  font-size: 3.5vh;
  margin-right:0px;
  align-items:center;
  display:flex;
  margin-left:15%;
  text-align:center;
}


#middle {
  width: 60%;
  margin-top:30vh;
  background-color: #fff1e1;
  margin:0 auto;
  align-items: center;
  box-shadow: 10px 10px 10px 0px rgba(0, 0, 0, 0.5), 0px -10px 10px 0px rgba(0, 0, 0, 0.5);
}

#middletop {
  width: 100%;
  height: 30%;
  display: flex;
  justify-content: space-between;
  border-top: 1px solid black;
  border-bottom:1px ridge black;
}

#middlemiddle {
  width: 100%;
  margin-top:10%;
  align-items:center;
  background-color: #fff1e1;

}

.aboutme{
  height:30%;
  width:65%;
  align-items: center;
  justify-content: space-between;

}

.list{
  width:90%;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
  font-size: 1.4vw;
  line-height:90%;
  color:#101820FF;
}
.list2{
  width:80%;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
  font-size: 1.4vw;
  padding-left:5%;
  line-height:105%;
  color:#101820FF;
  padding-bottom:2%;
  background-color: hsl(43, 67%, 93%);
  border-style: ridge; 
  border-color: black;
  box-shadow: 10px 10px 10px 0px rgba(0, 0, 0, 0.25);
  margin-bottom:5%;
}
.list3{
  width:90%;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
  font-size: 1.4vw;
  line-height:100 %;
  color:#101820FF;  
  background-color: hsl(43, 67%, 93%);
  border-style: ridge;
  box-shadow: 10px 10px 10px 0px rgba(0, 0, 0, 0.25);
}

.diagnoza{
  width:40%;
  height:80vh;
  justify-content: space-between;
  align-items: center;
  margin-left:0px;
  font-size: 1.4vw;
  line-height:1.5;
  margin-left:4%;
  padding-left:2.5%;
  padding-right:2.5%;
  background-color: hsl(43, 67%, 93%);
  border-style: ridge;
  box-shadow: 10px 10px 10px 0px rgba(0, 0, 0, 0.25);
  padding-bottom:2.5%;
  text-align: center;
  border-color: black;
}

.pojemnik{
	display:flex;
}
.pojemnik2{
	display:flex;
}
.mioterapia{
  width:80%;
  height:60vh;
  margin: 0 auto;
  justify-content: space-between;
  align-items: center;
  font-size: 1.4vw;
  line-height:1.5;
  padding-left:2.5%;
  padding-right:2.5%;
  background-color: hsl(43, 67%, 93%);
  border-style: ridge;
  box-shadow: 10px 10px 10px 0px rgba(0, 0, 0, 0.25);
  padding-bottom:2.5%;
  text-align: center;
  margin-top:5%;
  border-color: black;
}
.konsultacje{
  width:80%;
  height:30vh;
  margin: 0 auto;
  justify-content: space-between;
  align-items: center;
  font-size: 1.4vw;
  line-height:1.5;
  padding-left:2.5%;
  padding-right:2.5%;
  background-color: hsl(43, 67%, 93%);
  border-style: ridge;
  box-shadow: 10px 10px 10px 0px rgba(0, 0, 0, 0.25);
  padding-bottom:2.5%;
  text-align: center;
  margin-top:5%;
  border-color: black;
  margin-bottom:5%;
}
.czytanie {
  width:80%;
  height:60vh;
  margin: 0 auto;
  justify-content: space-between;
  align-items: center;
  font-size: 1.4vw;
  line-height:1.5;
  padding-left:2.5%;
  padding-right:2.5%;
  background-color: hsl(43, 67%, 93%);
  border-style: ridge;
  box-shadow: 10px 10px 10px 0px rgba(0, 0, 0, 0.25);
  padding-bottom:2.5%;
  text-align: center;
  margin-top:5%;
  border-color: black;
  margin-bottom:5%;
}
.terapia{
  width:40%;
  height:80vh;
  margin: 0 auto;
  justify-content: space-between;
  align-items: center;
  font-size: 1.35vw;
  line-height:1.5;
  padding-left:2.5%;
  padding-right:2.5%;
  background-color: hsl(43, 67%, 93%);
  border-style: ridge; 
  border-color: black;
  box-shadow: 10px 10px 10px 0px rgba(0, 0, 0, 0.25);
  padding-bottom:2.5%;
  text-align: center;
  margin-bottom:5%;
}
.text3{
  width:80%;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
  font-size: 1.4vw;
  line-height:150%;
  background-color: hsl(43, 67%, 93%);
  border-style: ridge;
  border-color:black;
  padding-left:5%;
  box-shadow: 10px 10px 10px 0px rgba(0, 0, 0, 0.25);
  margin-top:10%;
}
.endline{
	height:5	vh;
	margin-bottom:2%;
}
.zdj{
  width:30%;
}

.zdj img{
	height:100%;
	width:100%;
}
.aboutme a{
  color: black;
  font-size: 1.3vw;
  margin-top: center;
  text-decoration: none;
}
.option1 {
  height: 20%;
  display: inline-grid;
  align-items: center;
  margin-left: 5%;
  margin-top:2%;

}
.option2 {
  height: 20%;
  display: inline-grid;
  align-items: center;
  margin-left: 3.5%;
  margin-top:2%;
}
.option4 {
  height: 20%;
  display: inline-grid;
  align-items: center;
  margin-left: 3.5%;
  margin-top:2%;
}
.tel{
  height: 20%;
  display: inline-grid;
  margin-left:28%;
}
.tel a{
  color: black;
  font-size: 1.6vw;
  font-weight: bold
}
.option1 a{
  color: black;
  font-size: 1.1vw;
  text-decoration: none;
}

.option2 a {
  color: black;
  font-size: 1.1vw;
  text-decoration: none;
}
.option4 a {
  color: black;
  font-size: 1.1vw;
  text-decoration: none;
}

.option1 a:hover, .option2 a:hover, .option4 a:hover {
  border: 2px dotted;
  border-radius: 20px;
  text-decoration: none;
}

@media(max-width:600px){
  .left {
    width:100%;
	height:10%;
	background-color: #fff1e1;
	margin-top:0;
  }
  .left a {
	font-size:2vh;
  }
  #middle{
    width:100%;
	margin-top:7%;
  }
  .pasek {
	width:100%;
	height:3vh;
  }
  .tel {
	margin-left:7%;
  }
  .logo{
    margin-left:2%;
  }
  .option1 a {
	font-size: 2.5vw;
  }
  .option2 a {
	font-size: 2.5vw;
  }
  .option4 a {
	font-size: 2.5vw;
  }
  .tel a{
	margin-left:-8%;
	font-size:3vw;
  }
  .aboutme {
	  height:50%;
  }
  .aboutme a{
	font-size:1.5vh;
  }
  .zdj {
	margin-top:22%;
	height:50%;
  }
  .diagnoza {
	font-size:1.3vh;
	height:90%;
	margin-left:2.5%;
  }
  .czytanie {
	font-size:1.3vh;
	  height:50%;//
  }
  .terapia {
	font-size:1.3vh;
	height:90%;
  }
  .mioterapia {
	font-size:1.3vh;
	height:80%;
  }
  .konsultacje {
	font-size:1.3vh;
	height:80%;
  }
  .text3 {
	font-size:1.3vh;
  }
  .option1 a:hover, .option2 a:hover, .option4 a:hover {
    border: 1.5px dotted;
    border-radius: 0.5px;
    text-decoration: none;
  }
  .list a{
	font-size:1.3vh;
	line-height:80%;
  }
  .list2 a{
	font-size:1.3vh;
	line-height:95%;
  }
  .list2 {
	font-size:2vh;
  }
  h2 {
	  font-size:1.8vh;
  }
  body, html {
    background-color: #fff1e1;
  }
}
@media(max-width:1000px) and (min-width:700px) and (min-height:600px) and (max-height:1500px){
	.left {
    width:100%;
	height:10%;
	background-color: #fff1e1;
  }
  .left a {
	font-size:3vh;
  }
  #middle{
    width:100%;
	margin-top:-5%;
	box-shadow: none;
  }
  .pasek {
	width:100%;
	height:5vh;
  }
  .tel {
	margin-left:7%;
  }
  .logo{
    margin-left:2%;
  }
  .option1 a {
	font-size: 2.5vw;
  }
  .option2 a {
	font-size: 2.5vw;
  }
  .option4 a {
	font-size: 2.5vw;
  }
  .tel a{
	margin-left:-8%;
	font-size:3vw;
  }
  .aboutme {
	  height:50%;
  }
  .aboutme a{
	font-size:2vh;
  }
  .zdj {
	margin-top:22%;
	height:50%;
  }
  .diagnoza {
	font-size:2vh;
	height:80%;
	margin-left:2.5%;
  }
  .czytanie {
	  font-size:2vh;
	  height:50%;//
  }
  .terapia {
	font-size:2vh;
	height:80%;
  }
  .mioterapia {
	font-size:2vh;
	height:80%;
  }
  .konsultacje {
	font-size:2vh;
	height:80%;
  }
  .text3 {
	font-size:2vh;
  }
  .option1 a:hover, .option2 a:hover, .option4 a:hover {
    border: 1.5px dotted;
    border-radius: 0.5px;
    text-decoration: none;
  }
  .list a{
	font-size:2vh;
	line-height:80%;
  }
  .list2 a{
	font-size:2vh;
	line-height:95%;
  }
  .list2 {
	font-size:2vh;
  }
  body, html {
    background-color: #fff1e1;
  }
}
@media(max-width:1000px) and (min-width:700px) and (max-height:600px){
	.left {
    width:100%;
	height:10%;
	background-color: #fff1e1;
  }
  .left a {
	font-size:6vh;
  }
  #middle{
    width:100%;
	box-shadow: none;
  }
  .pasek {
	width:100%;
	height:10vh;
  }
  .tel {
	margin-left:7%;
	width:30%;
  }
  .logo{
    margin-left:2%;
  }
  .option1 a {
	font-size: 2vw;
  }
  .option2 a {
	font-size: 2vw;
  }
  .option4 a {
	font-size: 2vw;
  }
  .tel a{
	margin-left:20%;
	font-size:2.5vw;
  }
  .aboutme {
	  height:50%;
  }
  .aboutme a{
	font-size:4vh;
  }
  .zdj {
	margin-top:0%;
	height:50%;
  }
  .diagnoza {
	font-size:3vh;
	height:80%;
	margin-left:2.5%;
  }
  .czytanie {
	  font-size:3vh;
	  height:50%;
  }
  .terapia {
	font-size:3vh;
	height:80%;
  }
  .mioterapia {
	font-size:3vh;
	height:80%;
  }
  .konsultacje {
	font-size:3vh;
	height:80%;
  }
  .text3 {
	font-size:3vh;
  }
  .option1 a:hover, .option2 a:hover, .option4 a:hover {
    border: 1.5px dotted;
    border-radius: 0.5px;
    text-decoration: none;
  }
  .list a{
	font-size:3vh;
	line-height:80%;
  }
  .list2 a{
	font-size:3vh;
	line-height:90%;
  }
  .list2 {
	font-size:3vh;
  }
  body, html {
    background-color: #fff1e1;
  }
}