body {
	background: pink;
  font-family: verdana;
  font-size: 16px;
}

header {
  color:steelblue;
  background: white;
  font-family: "Sacramento", cursive;
  Font-size: 2.5em;
  padding: -10%;
  display: flex; 
  justify-content: space-between; 
  align-items: center;
}

header h1{
  color: steelblue;
  margin-right: 10%;
}

header img{
  margin-left: 5%
}

h2 {
	text-align: center;
  color: steelblue;
  font-size: 3em;
  font-family: "sacramento", cursive;
}
#nav label,
#hamburger {
	display: none;
}
@media screen and (max-width: 576px){
  #navitems a {
    display: inline-block;
    width: 100%;
  }
  #nav label { 
    display: inline-block; 
    cursor: pointer;
    padding: 25px;
    font-size: 2em;
  }
  #navitems { display: none; }
  
  #nav input:checked ~ #navitems { 
    display: block; 
  }
}
#home {
  width: 85%;
	border: 2px, solid, steel-blue;
  padding: 25px;
  margin: auto auto;
  background-color: white;
}

#greeting {
  text-align: center;
}

figure > img{
  width:100%;
  min-height:100%;
  border: 5px, solid, steelblue;
  border-radius: 15px;
}

ul {
  padding: 10;
  margin: 5px;
  font-size: 1.2em;
}

#catfaces {
	max-width: 300px;
  border: 3px solid black;
  border-radius: 3px;
}

details {
 padding: 10px;
}

.name {
font-family: "sacramento", cursive;
  font-size: 3em;
}
.team-container {
	display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  background: steelblue;
  border: 5px, solid, black;
}

.team {
	display: flex;
  flex-direction: row;
  justify-content: space-evenly;
 	background: white;
  margin: 15px;
  padding: 1vw;
  max-width: 100%;
  border: 3px solid;
  border-radius: 5px;
  min-width: 100px;
}

.summary {
	padding: .1em;
  display: flex;
  flex-direction: column;
  align-items: center;
}

@media (max-width: 575px) {
  .summary {
    width: 100%;
  }
}
@media (max-width: 575px) {
  .team {
    width: 100%;
  }
}
@media (min-width: 576px) and (max-width: 768) {
  .team {
   	width: 40%;
  }
}

@media (min-width: 769px) and (max-width: 991px) {
  .team {
    width: 35%;
  }
}

@media (min-width: 992px) {
  .team {
    width: 20%;
  }
}
@media (max-width: 575px) {
  .image {
    width: 100%;
  }
}
@media (min-width: 576px) and (max-width: 768) {
  .image {
   	width: 100%;
  }
}

@media (min-width: 769px) and (max-width: 991px) {
  .image {
    width: 85%;
  }
}

@media (min-width: 992px) {
  .image {
    width: 100%;
  }
}
@media (max-width: 575px) {
  .testimonials {
    width: 25%;
  }
}
@media (min-width: 576px) and (max-width: 768) {
  .testimonials {
   	width: 40%;
  }
}

@media (min-width: 769px) and (max-width: 991px) {
  .testimonials {
    width: 35%;
  }
}

@media (min-width: 992px) {
  .testimonials {
    width: 20%;
  }
}
.comparison-container {
	display: flex;
	flex-wrap: wrap;
  flex-flow: row;
	justify-content: space-evenly;
	background: steelblue;
	border: 5px, solid, black;
}

.testimony {
 max-width: 100%;
 min-width: 100px;
 border-radius: 5px;
}

.skip {
  position: absolute;
  top: auto;
  left: -10000px;
}

.skip:focus {
  position: static;
  width: auto;
  height: auto;
}

a:link {
  color: steelblue;
}

a:visited {
  color: rebeccapurple;
}

#nav {
  position: sticky;
  top: 0;
	width: 100%;
  display: flex;
  background-color: lavenderblush;
  border: 2px, solid, plum;
}
#navitems {
	display: flex;
  align-items: center;
  justify-content: space-around;
}
#navitems a {
 flex-grow: 1;
 flex-basis: 0;
 padding: 12px;
  margin-top: 3px;
 text-decoration: none;
 text-align: center;
  font-family: Verdana;
  font-size: 1.2em;
  align-items: stretch;
  flex-flow: row;
  justify-content: space-evenly;
}
#navitems a:hover {
	background-color: steelblue;
  color: white;
}

#contact label {
	width: 100%;
}
#contact input,
#contact textarea {
	width: 100%;
  margin-top: 0.5em;
  margin-bottom: 1em;
}
#contact input {
	height: 2em;
}
#cat {
	text-align:center;
}
#cat label {
	margin-right: 2em;
}
fieldset {
	background-color: lavenderblush;
  border-color: plum;
  border-radius: 5px;
 	padding: 1.5em;
  margin-top: 1em;
}
fieldset input,
fieldset textarea {
	border-color: plum;
}
legend {
	background-color: steelblue;
  color: white;
  padding: 0.5em 1em;
  text-align: center;
  border-radius: 15px;
}
.btn {
	padding: 0.5em 1em;
  border-color: transparent;
  margin-right: 1em;
  cursor: pointer;
}
#submit {
	background-color: steelblue;
  color: white;
}
#reset {
	background-color: steelblue;
  color: white;
}
#emailnote {
	position: absolute;
  left: -10000px;
  width: 0;
  height: 0;
  overflow: hidden;
}
#phonenote {
	position: absolute;
  left: -10000px;
  width: 0;
  height: 0;
  overflow: hidden;
}
input:focus {
	outline: 2px solid steelblue;
}
input[type="checkbox"] {
  height: 1em;
  width: 100%;
}

footer {
  background: lavenderblush;
  border: 2px, solid, plum;
padding: 12px;
  margin-top: 3px;
 text-decoration: none;
 text-align: center;
  font-family: Verdana;
  font-size: 1.2em;
}