html{
  background: black
}

h1 {text-align: center;
font-size: 40px;
color: rgb(0,204,255);
margin: 0 auto;
font-family: 'Bree Serif', serif;


}
p {
  width: 400px;
  padding: 20px;
  background: rgb(255,255,255);
  color: black;
  text-align: center;
  font-size: 40px;
margin: 0 auto;
font-family: 'Bree Serif', serif;
}
img {
  width: 700px;
  margin: 0 auto;
display:block;
}

.mybox {
  width: 50px;
  height: 50px;
  background: purple;
  border: 1px solid blue;
  margin: 0 auto;
display:block;
}

.anotherbox {
  width: 100px;
  height: 100px;
  background: url('myimage.jpg');
}
iframe {margin: 0 auto;
}
#curvedarrow {
      position: relative;
      width: 0;
      height: 0;
      border-top: 9px solid transparent;
      border-right: 9px solid red;
      transform: rotate(10deg);
    }
    #curvedarrow:after {
      content: "";
      position: absolute;
      border: 0 solid transparent;
      border-top: 3px solid red;
      border-radius: 20px 0 0 0;
      top: -12px;
      left: -9px;
      width: 12px;
      height: 12px;
      transform: rotate(45deg);
    }