html, body{
  margin:0px;
  padding: 0px;
  overflow-x: hidden;
  height: 100%;
  min-height: 100%;
}
header{
  width: 100%;
  height: 7vw;
  margin: 0px;
  padding: 0px;

}
header a{
  color: black;
  text-decoration: none;
}
/*sign in*/
.signin .showSignUpForm{
  color: blueviolet;
}
.signin button{
  color: blueviolet;
  border: 2px solid blueviolet;
}
.signin .signinbox{
  border: none !important;
  box-shadow: 10px 10px blueviolet !important; 
  background-color: rgba(226, 225, 225, 0.514) !important;
}
.signin h2{
  color: blueviolet !important;
}
/*sign in end*/
/*sign up*/
.signup .showSignInForm{
  color: blueviolet !important;
}
.signup button{
  color: blueviolet;
  border: 2px solid blueviolet;
}
.signup .signupbox{
  border: none !important;
  box-shadow: 10px 10px blueviolet !important; 
  background-color: rgba(226, 225, 225, 0.514) !important;
  margin-bottom: 100px;
}
.signup h2{
  color: blueviolet !important;
}
/*sign up end*/
/*profile*/
.profile .showSignInForm{
  color: blueviolet !important;
}
.profile button{
  color: blueviolet;
  border: 2px solid blueviolet;
}
.profile .profilebox{
  border: none !important;
  box-shadow: 10px 10px blueviolet !important; 
  background-color: rgba(226, 225, 225, 0.514) !important;
  margin-bottom: 150px;
}
.profile h2{
  color: blueviolet !important;

}
/*profile end*/
/*activites pages*/
.ActPages .imgbox{
  flex-wrap: wrap;
  display: flex;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 5vw;
}
.ActPages .img{
  border: 10px solid blueviolet;
  margin-right: auto;
  margin-left: auto;
}
.ActPages .imgbox a{
  text-decoration: none;
  color: blueviolet;
}
.ActPages .imgbox p{
  text-align: center;
  width: 100%;
  height: 20%;
  font-family: 'roboto';
  font-size:2vw;
  margin: 0%;
}
.ActPages .imgbox h1{
  text-align: center;
  width:100%;
  height: 20%;
  text-decoration: none;
  font-family: 'Open Sans', sans-serif;
  font-size: 4vw;
  margin: 0%;
}
.ActPages .titleandwords{
  flex-wrap: wrap;
  display: flex;
  width: 40%;
  margin-right: auto;
  margin-left: auto;
}
.activitiespage{
  display: flex;
  flex-wrap: wrap;
  margin-left: auto;
  margin-right: auto;
}
.activitiespage .donatebox{
  width: 30%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 5%;
  padding-right: 5%;
  text-align: center;
}
.activitiespage .donatebox img{
  border: 10px solid blueviolet;
  width: 90% !important;
  height: 30vh;
  opacity: 0.5
}
.activitiespage .donatebox a{
  text-decoration: none;
  color: black;
  font-family: 'Open Sans', sans-serif;
  font-size: 1em;
  font-weight: bold;
}
.activitiespage .donatebox h2{
  margin-block-start: auto;
  margin-block-end: auto;
  transform: translateY(-110px);
  font-family: 'Open Sans', sans-serif;
}

/*activites pages end*/

@media screen and (min-width: 427px){
  /*footer*/
footer{
  background-color:blueviolet;
  height: 5vw;
  position: block;
  text-align: center;
  position: absolute;
  bottom: 0;
  width: 100%;
}
footer p{
  text-align: center;
  margin: 10px;
  padding: 0%;
  font-family: 'Open Sans', sans-serif;
  color:black;
  background: none;
  position: inline-block;
  display: inline-block;  
  font-size: 2.5vw;
  text-decoration: none;
  padding-top: 0vh;

}
.contact {
  color: black;
  text-decoration: none;
}
footer u{
  text-decoration: none;
  font-family: 'Open Sans', sans-serif;
  font-size: 2.5vw;
  font-weight: bold;
}
/*footer end*/

/*header*/
header{
  display: flex;
  flex-direction: row;
  width: 100%;
}
.header__menu{
  display: none;
}

.nav__list{
  display: none;
}
.pages__item{
  font-family: 'Open Sans', sans-serif;
  text-align: right;
  font-size: 2.5vw;
  margin-top: 10px;
  justify-self: flex-end;
}
.pages__list{
  color: green;
  text-align: right;
  right: 0;
  padding-left:0vw;
  top: 0px;
  width: 60%;
  justify-content: space-evenly;
  display: flex;
  margin-left: 40vw;
  justify-self: flex-end;
   float: right important!;
   align-self: flex-start;
}
.icon{
  height: 7vw;
}
.icon a{
  height: 7vw;
}
/*header end*/
/*homepage*/
.homepage .pages__list{
  width: 100%;
  margin-left: 0%;
}
.homepage{
  background-color:blueviolet;
}
.homepage_body{
  background-color:blueviolet;
  height:100%;
}
#page_container{
  height:100%
}
html, body{
  height:100%;
}
body{
  min-height: 100vh;
}
.icon_large{
  margin-left: auto;
  margin-right: auto;
  display: flex;
  align-self: center;
  height: 70vh;
  padding-left: 10px;
}
.homepage_body_content{
  margin-top: 0%;
}
.homepage_body_content a{
  text-align: center;
  color: black;
  font-size: 5vw;
  font-family: 'Open Sans', sans-serif;
  align-self: center;
  font-weight: 1500;
}
.about_us_link{
  width:100%;
  text-align: center;
}
/*homepage end*/
/*about us*/
.aboutus{
  display: flex;
  direction: row;
  height: 100%;
  flex-wrap: wrap;
}
.aboutus h2{
  font-family: 'Open Sans', sans-serif;
  font-size: 6vw;
  width: 100%;
  text-align: center;
  margin: 0%;
  justify-self: center;
  color: rgb(78, 77, 77);
}
.aboutus p{
  width: 50%;
  margin: 0%;
  margin-top: 1vh;
  font-family: 'roboto';
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  font-size: 2vw;
}
.aboutus img{
  box-shadow:10px 10px blueviolet;
  margin-left: 4vw;
  margin-top: 1vh;
  width: 40%;
}
/*about us end*/
/*CDC*/
.cdcpage{
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  height: 100vh;
}
.cdcpage h2{
  color: rgb(78, 77, 77);
  text-align: center;
  font-family: 'Open Sans', sans-serif;
  width: 54%;
  font-size: 6vw;
  margin-bottom: 0px;
  margin-top: 0px;
}
.cdcpage p{
  text-align: center;
  font-family: 'roboto';
  width: 50%;
  font-size: 1.75vw;
  padding: 2%;
  padding-bottom: 8vh;
}
.cdcpage .twitter{
  margin-top: 0%;
  border: 10px solid blueviolet;
  margin-right: 4vw;
}
.cdcpage .twitter_small{
  display: none;
}
/*CDC end*/
/*hospital*/
.hospitalmappage{
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  height: 93vh;
}

.hospitalmappage h2{
  color: rgb(78, 77, 77);
  text-align: center;
  font-family: 'Open Sans', sans-serif;
  width: 40%;
  font-size: 6vw;
  margin-bottom: 0px;
  margin-top: 0px;
  margin-left: 5%;
  padding-bottom: 2%;
}
.hospitalmappage p{
  text-align: center;
  font-family: 'roboto';
  width: 40%;
  font-size: 2vw;
  padding-bottom: 0;
  margin-top: 0%;
  margin-left: 5%;
}
.hospitalmappage footer p{
  text-align: center;
  font-size: 2vw;
  padding-top: 20px;
  margin-top: 0%;
  margin-left: 0%;
}
.hospitalmappage #link{
  margin-bottom: 8vh;
  text-align: center;
  font-family: 'roboto';
  color:rgb(83, 81, 81);
  font-size: 3vw;
  width: 40%;
  padding: 2%;
}
.hospitalmappage .linkbox{
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  box-shadow: 5px 5px blueviolet;
  background-color: rgba(226, 225, 225, 0.514);
  margin-bottom: 10px;
}
.hospitalmappage .links{
  width: 30%;
  margin-left: auto;
  margin-right: auto;
}
#map_canvas {
  height: 70%;
  width: 40%;
  margin: 0px;
  padding: 0px;
  border: 10px solid blueviolet;
}
/*hospital end*/
}
@media screen and (max-width: 768px)and (min-width: 427px){
/*about us*/
.aboutus img{
  height:30vw
}
.aboutus p{
  width: 40%;
}
/*about us end*/
/*footer*/
footer{
  background-color:blueviolet;
  height: 5vw;
  position: block;
  text-align: center;
  position: absolute;
  bottom: 0;
  width: 100%;
}
footer p{
  margin: 10px;
  padding: 0;
  font-size: 2vw;
}
/*footer end*/
/*header*/
header{
  height: 10vw;
}
.pages__item{
  font-size: 2.5vw;
  margin-top: 10px;
}
.pages__list{
  width: 50%;
}
.icon{
  height: 10vw;
}
.icon a{
  height: 10vw;
}
/*header end*/
}

@media screen and (max-width: 426px){
  /*footer*/
  footer{
    background-color:blueviolet;
    height: 7vw;
    position: block;
    text-align: center;
    position: absolute;
    bottom: 0;
    width: 100%;
  }
footer p{
  text-align: center;
  font-family: 'Open Sans', sans-serif;
  color:black;
  background: none;
  position: inline-block;
  display: inline-block; 
  align-self: center;
  margin: 0;
  margin-top: 3px;
}
.contact {
  color: black;
  text-decoration: none;
}
footer u{
  text-decoration: none;
}
/* footer end*/
/*header */
header{
  height:100px;
}
.hamMenu{
  justify-content: right;
  margin-right: 0;
  margin-left: auto;
  margin-top:30px;
  float: right;
  margin-right: 10px;
  position: relative;
}

.icon{
  height:100px;
  padding-top: 5px;
}

nav{
  width: 100%;
}
nav li{
  font-family: Arial, Helvetica, sans-serif;
  font-size: 20px;
  padding-bottom: 20px;
  padding-left: 0%;
  color: black;
  list-style: none;
}
nav li a{
  color: black;
  text-decoration: none;
}
nav ul{
  padding-left: 0%;
}
.nav {
    z-index: 10;
    background-color:blueviolet;
    width: 100%;
    position: absolute;
    /* This trasform moves the drawer off canvas. */
    -webkit-transform: translate(0, -300px);
    transform: translate(0, -300px);
    /* Optionally, we animate the drawer. */
    transition: transform 0.3s ease;
    top:0px;
  }
  /*webkit is a rendering engine for the browser*/
.nav__item {
  display: list-item;
  text-transform: uppercase;
  width: 100%;
  text-align: center;
  color: black;
} 
.nav.open {
  -webkit-transform: translate(0, 100px);
  transform: translate(0, 100px);
  }
.pages__list{
  display: none;
}
.icon{
  height: 100px;
}
.icon a{
  height: 100px;
}
/*header end */
/*homepage*/
.homepage .pages__list{
  width: 100%;
  margin-left: 0%;
}
.homepage{
  background-color:blueviolet;
}
.homepage_body{
  background-color:blueviolet;
  height:100%;
}
#page_container{
  height:100%
}
html, body{
  height:100%;
}
body{
  min-height: 100vh;
}
.icon_large{
  margin-left: auto;
  margin-right: auto;
  display: flex;
  align-self: center;
  height: 50vh;
}
.homepage_body_content{
  margin-top: 10%;
}
.homepage .pages__item{
  font-family: 'Open Sans', sans-serif;
  text-align: right;
  font-size: 5vw;
  margin-top: 30px;
  justify-self: flex-end;
}
.homepage .pages__list{
  color: green;
  text-align: right;
  right: 0;
  padding-left:0vw;
  top: 0px;
  width: 100%;
  justify-content: space-evenly;
  display: flex;
  margin-left: 0vw;
  justify-self: flex-end;
   float: right important!;
   align-self: flex-start;
}
.homepage_body_content a{
  text-align: center;
  color: black;
  font-size: 5vw;
  font-family: 'Open Sans', sans-serif;
  align-self: center;
  font-weight: 1500;
}
.about_us_link{
  width:100%;
  text-align: center;
}
/*homepage end*/
/*about us*/
.aboutus{
  display: flex;
  direction: column;
  flex-wrap: wrap;
}
.aboutus h2{
  font-family: 'Open Sans', sans-serif;
  font-size: 8vw;
  width: 100%;
  text-align: center;
  margin: 0%;
  justify-self: center;
  color: rgb(78, 77, 77);
  text-transform: uppercase;
}
.aboutus p{
  margin: 5vw;
  width: 90vw;
  margin-top: 1vh;
  margin-bottom: 8vh;
  font-family: 'roboto';
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  font-size: 4vw;
}
.aboutus img{
  border: 3vw solid blueviolet;
  margin: 5vw;
  width: 84vw;
}
/*about us end*/
/*CDC*/

.cdcpage h2{
  color: rgb(78, 77, 77);
  text-align: center;
  font-family: 'Open Sans', sans-serif;
  width: 100%;
  font-size: 16vw;
  margin-bottom: 10px;
  margin-top: 10px;
}
.cdcpage p{
  text-align: center;
  font-family: 'roboto';
  width: 90%;
  font-size: 6vw;
  padding: 5%;
  padding-bottom: 8vh;
  padding-top: 2%;
}
.cdcpage .twitter{
  display: none;
}
.cdcpage .twitter_small{
  margin-top: 0%;
  border: 3vw solid blueviolet;
  margin: 5vw;
  margin-bottom: 8vh;
}
/*CDC end*/
/*hospital*/

.hospitalmappage h2{
  color: rgb(78, 77, 77);
  text-align: center;
  font-family: 'Open Sans', sans-serif;
  width: 90%;
  font-size: 10vw;
  margin-bottom: 10px;
  margin-top: 10px;
  padding: 2%;
  margin-left: auto;
  margin-right: auto;
}
.hospitalmappage p{
  text-align: center;
  font-family: 'roboto';
  width: 90%;
  font-size: 4vw;
  padding: 2%;
  padding-bottom: 0;
  margin-top: 0%;
  margin-left: auto;
  margin-right: auto;
}
.hospitalmappage #link{
  padding-bottom: 8vh;
  text-align: center;
  font-family: 'roboto';
  font-size: 4vw;
  color:white;
  width: 40%;
  padding: 2%;
  text-transform: uppercase;
  text-decoration: none;
}
.hospitalmappage .linkbox{
  background-color:blueviolet;
  padding:5%;
  width:40%;
  margin-bottom: 20px;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
#map_canvas {
  height: 70vh;
  width: 90%;
  padding: 0px;
  margin-top: 0%;
  border: 10px solid blueviolet;
  margin-bottom: 8vh;
  margin-left: auto;
  margin-right: auto;
}
/*hospital end*/
}