body{
	/*width: 750px;*/
	width: 100%;
	height: 736px;
	
}

.wrapper{
  	/*width: 750px;*/
	width: 100%;
  	height: 667px;
	background-color: #F1F2F2;
  	position: relative;
	
}

#menubar{
	width:375px;;
	height: 60px;
	position: relative;
	background-color: black;
	text-align:center;
	vertical-align: middle;
	line-height: 60px;
	font-size: 24px;
	color: white;
	font-family:inconsolata;
	font-weight:bold;
	z-index: 19;
}
/* Menu */

#hamburgermenubar{
  width: 190px;
  height: 62px;
  position: relative;
  background-color:black;
  
  font-size: 18px;
  color: white;
  font-family: inconsolata;
  font-weight: bold;
	z-index: 20;
}

a{
 text-decoration: none;
}

ul{
  list-style: none;
  padding-left: 0px;
  padding-bottom: 0px;
  padding-top: 0;
  padding-right: 0px;
}

li{
	
  font-size: 14px;
  border-top: 1px solid black;
  border-bottom: none;
  padding-left: 60px;
  padding-top: 5px;
  vertical-align: middle;
  color: gray;
  background-color:#F4F3F3;
  box-sizing: border-box;
}

.icon{
	position: absolute;
	width: 11%;
	height: 11%;
	margin-left: -40px;
	margin-top: 6px
}

#hamburgermenu{
  margin-top: -31px;
  width: 190px;
  height: 136px;
  position: absolute;
  text-align: left;
  font-family: inconsolata;
  background-color: white;
  z-index: 19;
}

.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 10;
    top: 0;
    left: 0;
    overflow-x: hidden;
    transition: 0.5s;
}

.sidenav a {
    text-decoration: none;
    display: block;
    transition: 0.3s;
}

.sidenav a:hover {
    color: #f1f1f1;
}

.sidenav .closebtn {
	color: white;
    position: absolute;
    font-size: 36px;
    margin-left: 20px;
	z-index: 21;
}
#filterimage {
	position: inherit;
	width: 30px;
	height: 40px;
	left: 320px;
	top: 117px;
	z-index: 5;
}

.checkmark{
	position: absolute;
	width: 18px;
	height: 30px;
	left: 340px;
	z-index: 2;
}

#checkmark {
	position: absolute;
	width: 18px;
	height: 30px;
	left: 340px;
	top: 0px;
	z-index: 2;
}

#bytecategories {
	position: absolute;
	top: 100px;
	/*width: 708px;*/
	width: 100%;
	height: 60px;
	background-color: #87B8C7;
	padding-left: 20px;
	vertical-align: middle;
	line-height: 60px;
	font-size: 20px;
	color: white;
	font-family:inconsolata;
	font-weight:bold;
	z-index: 2;
}


#acutecare {
	/*width: 712px;*/
	width: 100%;
	height: 60px;
	position: absolute;
	top: 160px; 
	background-color: white;
	font-size: 20px;
	font-family:inconsolata;
	font-weight:bold;
	color: black;
	vertical-align: middle;
	text-align: left;
	line-height: 60px;
	padding-left: 20px;
	z-index: 3;
}

.icon{
	position: absolute;
	width: 7%;
	height: 7%;
	left:  57px;
}

.fraction1 { 
	padding-left: 150px; 
	font-size: 20px;

}

.dash1 {
	padding-left: 20px; 
	vertical-align: middle;
	font-size: 20px;
}

#rectangle2 {
	/*width: 712px;*/
	width: 100%;
	height: 60px;
	background-color: white;
	top: 230px; 
	position: absolute;
	font-size: 20px;
	font-family:inconsolata;
	font-weight:bold;
	color: black;
	vertical-align: middle;
	text-align: left;
	line-height: 60px;
	padding-left: 20px;
	z-index: 3;
}

.fraction2 { 
	padding-left: 190px; 
	font-size: 20px; 
}

#rectangle3 {
	/*width: 712px;*/
	width: 100%;
	height: 60px;
	background-color: white;
	top: 300px; 
	position: absolute;
	font-size: 20px;
	font-family:inconsolata;
	font-weight:bold;
	color: black;
	vertical-align: middle;
	text-align: left;
	line-height: 60px;
	padding-left: 20px;
	z-index: 3;
}

.fraction3 { 
	padding-left: 100px; 
	font-size: 20px; 
}


#rectangle4 {
	/*width: 712px;*/
	width: 100%;
	height: 60px;
	background-color: white;
	top: 370px; 
	position: absolute;
	font-size: 20px;
	font-family:inconsolata;
	font-weight:bold;
	color: black;
	vertical-align: middle;
	text-align: left;
	line-height: 60px;
	padding-left: 20px;
	z-index: 3;
}

.fraction4 { 
	padding-left: 161px; 
	font-size: 20px; 
}

.dash4 {
	padding-left: 20px; 
	font-size: 20px;
	vertical-align: middle;
}


#rectangle5 {
	/*width: 712px;*/
	width: 100%;
	height: 60px;
	background-color: white;
	top: 440px; 
	position: absolute;
	font-size: 20px;
	font-family:inconsolata;
	font-weight:bold;
	color: black;
	vertical-align: middle;
	text-align: left;
	line-height: 60px;
	padding-left: 20px;
	z-index: 3;
}

.fraction5 { 
	padding-left: 10px; 
	font-size: 20px; 
}

.dash5 {
	padding-left: 20px; 
	font-size: 20px;
	vertical-align: middle;
}


#rectangle6 {
	/*width: 712px;*/
	width: 100%;
	height: 60px;
	background-color: white;
	top: 510px; 
	position: absolute;
	font-size: 20px;
	font-family:inconsolata;
	font-weight:bold;
	color: black;
	vertical-align: middle;
	text-align: left;
	line-height: 60px;
	padding-left: 20px;
	z-index: 3;
}

.fraction6 { 
	padding-left: 90px; 
	font-size: 20px; 
}

.dash6 {
	padding-left: 20px; 
	font-size: 20px;
	vertical-align: middle;
}

#rectangle7 {
	/*width: 712px;*/
	width: 100%;
	height: 60px;
	background-color: white;
	top: 580px; 
	position: absolute;
	font-size: 20px;
	font-family:inconsolata;
	font-weight:bold;
	color: black;
	vertical-align: middle;
	text-align: left;
	line-height: 60px;
	padding-left: 20px;
	z-index: 3;
}

#dropdown{
	width: 375px;
	height: 350px;
	background-color: #87B8C7;
	z-index: 2;
	top: 620px;
	position: absolute;
	color: white;
	font-size: 16px;
	font-family: inconsolata;
}

ul.dropdownlist{
	list-style: none;
}

li.dropdownlist{
  border-top: 1px solid white;
  width: 375px;
  border-bottom: none;
  padding: 30px 0px 30px 0px;
}

.fractiongreen { 
	padding-left: 170px; 
	font-size: 20px; 
	color: #00A651;
}

#searchbar {
	position: absolute;
	top: 100px;
	width: 100%;
	height: 60px;
	background-color: #565656;
	padding-left: 38px;
	vertical-align: middle;
	line-height: 60px;
	font-size: 20px;
	color: white;
	font-family:inconsolata;
	font-weight:bold;
	z-index: 2;
}
#searchresultsbar {
	position: absolute;
	top: 230px;
	width: 100%;
	height: 60px;
	background-color: #565656;
	padding-left: 38px;
	vertical-align: middle;
	line-height: 60px;
	font-size: 20px;
	color: white;
	font-family:inconsolata;
	font-weight:bold;
	z-index: 4;
}

#relatedresultsbar {
	position: absolute;
	top: 440px;
	width: 100%;
	height: 60px;
	background-color: #565656;
	padding-left: 38px;
	vertical-align: middle;
	line-height: 60px;
	font-size: 20px;
	color: white;
	font-family:inconsolata;
	font-weight:bold;
	z-index: 4;
}

#search {
	width: 100%;
	height: 60px;
	position: absolute;
	top: 160px; 
	background-color: white;
	font-size: 20px;
	font-family:inconsolata;
	font-weight:bold;
	color: black;
	vertical-align: middle;
	text-align: left;
	line-height: 60px;
	padding-left: 38px;
	z-index: 3;
}

#searchrectangle2 {
	width: 100%;
	height: 60px;
	background-color: white;
	top: 300px; 
	position: absolute;
	font-size: 20px;
	font-family:inconsolata;
	font-weight:bold;
	color: black;
	vertical-align: middle;
	text-align: left;
	line-height: 60px;
	padding-left: 38px;
	z-index: 3;
}

#searchrectangle3 {
	width: 100%;
	height: 60px;
	background-color: white;
	top: 370px; 
	position: absolute;
	font-size: 20px;
	font-family:inconsolata;
	font-weight:bold;
	color: black;
	vertical-align: middle;
	text-align: left;
	line-height: 60px;
	padding-left: 38px;
	z-index: 3;
}

#searchrectangle4 {
	width: 100%;
	height: 60px;
	background-color: white;
	top: 510px; 
	position: absolute;
	font-size: 20px;
	font-family:inconsolata;
	font-weight:bold;
	color: black;
	vertical-align: middle;
	text-align: left;
	line-height: 60px;
	padding-left: 38px;
	z-index: 3;
}

#searchrectangle5 {
	width: 100%;
	height: 60px;
	background-color: white;
	top: 580px; 
	position: absolute;
	font-size: 20px;
	font-family:inconsolata;
	font-weight:bold;
	color: black;
	vertical-align: middle;
	text-align: left;
	line-height: 60px;
	padding-left: 38px;
	z-index: 3;
}

