html {
  box-sizing: border-box;
}

body {
  font: 10px Helvetica Neue, Helvetica, sans-serif, Arial;
  margin: 0;
  text-anchor: end;
  /* background-color: rgb(255, 255, 255); */
}

*, *:before, *:after {
  box-sizing: inherit;
}

h2 {
  font-size: 3vw;
}

h3 {
  display: inline-block;
  font-size: 16pt;
  margin: 0;
  padding: 0;
}

ul {
  font-size: 16pt;
  padding-bottom: 10%;
  padding-left: 5%;
  /* font-family: "Didot LT STD"; */
}

li {
  padding: 1%;
}

p {
  font-size: 12pt;
  /* font-family: "Didot LT STD"; */
}

a:link {
  color: white;
  font-weight: bold;
}


 p a:visited {
  color: white;
  /* font-weight: bold; */
}
.square_btn a:visited {
  color: rgb(52, 52, 52);
}

.square_btn {
  display: inline-block;
  padding: 0.1em 1em;
  text-decoration: none;
  background-color: #d4d4d4;
  /* border: solid 2px #535353; */
  border-radius: 3px;
  transition: .4s;
  font-size: 20px;
  line-height: 35px;
  margin-top: 1%;
  height: 40px;
  vertical-align: middle;
  text-align: center;
  color: #292828;
}

.square_btn a:link {
  color: black;
  font-weight: bold;
}

.square_btn:hover {
  background: #464646;
  color: rgb(186, 186, 186);
}

.titleBox {
  /* display: grid; */
  /* height: 400px; */
  /* z-index: -1; */
  color: white;

  background-image: url("assets/headerPaintingtags2.jpg");
  /* position: relative; */
  /* max-width: 100%; */
  background-attachment:  fixed;
  background-position:  top;
  background-repeat: no-repeat;
  background-size: cover;

}

.title {
padding: 10%;

  position: relative;
  /* max-width: 100%; */

  /* background-color: black; */
    /* padding: 10%; */
  /* background-size:  auto; */
}

.header h1 {
  display: inline-block;
  font-size: 5vw;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  /* position:absolute; */
  /* margin: 1vw; */
  width: 50vw;
  overflow-wrap: break-word;
  top: 10%;
}

hr {
  border: 0.5px solid rgb(84, 84, 84);
  border-radius: 5px;
  margin-right: 10%;
  /* position: static; */
}

.title p {
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  /* position: absolute; */
  width: 50vw;
  font-size: 12pt;
  /* top:20% */
  overflow-wrap: break-word;
  /* margin: 10vw; */
  /* margin-left: 10vw; */
}

iframe {
  display: block;
  margin: auto;
  padding: 5%;
  z-index: 10;
  height: 40vw;
  width: 100%;
  /* margin-right: auto; */
}

.process {
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  position: relative;
  padding-left: 10%;
  max-width: 100%;
  background-size: contain, cover;
}

.process p {
  background-color: white;
  width: 40vw;
  /* top:20% */
  overflow-wrap: break-word;
}

.describeContainer img {
  width: 30vw;
  padding: 6%;
  left: 0;
}

.describeContainer1 img {
  width: 50vw;
  padding: 6%;
  left: 0;
}

.describeContainer2 img {
  padding: 3%;
  width:45vw;
  left: 0;
}

.describeContainer, .describeContainer1, .describeContainer2 {
  display: flex;
  align-items: center;
}

#dataSource {
  position: absolute;
  text-align: right;
  display: inline-block;
  margin-right: 0px;
  padding-right: : 0px;
  bottom: 3vh;
  right: 1%;
}

#dataSource p {
  display: inline-block;
  font-family: serif;
  font-size: 13pt;
  color: #dddddd;
}

#metLogo {
  display: inline-block;
  background-color: none;
  content: url(assets/metlogo.png);
  max-width: 50px;
}
