*{
  box-sizing:border-box;
  font-family:-apple-system,system-ui,BlinkMacSystemFont,segoe ui,Roboto,Oxygen,Ubuntu,helvetica neue,Arial,sans-serif;
  margin:auto
}

.bg-image{
  position:absolute;
  bottom:-88%
}

.container{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  /* width:100%; */
  margin:auto;
  border:#fbab40;
  height:100vh;
  background-color:#242628;
  background-image:url(./assets/world.svg);
  background-repeat:no-repeat;
  background-position-x:center;
  background-position-y:center;
  background-origin:padding-box
}

.header h3{
  text-align:center;
  color:#ff8c00;
  font-size:24px;
  font-style:normal;
  font-weight:600;
  margin:0;
  line-height:36px
}

.header{
  display:flex;
  position:relative;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  padding:0;
  font-style:normal
}

.header button{
  background-color:transparent;
  border-width:0;
  margin:5px
}

.header>h1{
  font-style:normal;
  font-weight:600;
  font-size:48px;
  line-height:150%;
  display:flex;
  align-items:center;
  text-align:center;
  color:#fff
}

.header>p{
  font-style:normal;
  font-weight:400;
  font-size:24px;
  line-height:150%;
  text-align:center;
  color:#fff;
  flex-grow:0;
  margin:16px 0
}

.options{
  display:flex;
  flex-direction:row
}

.options>a{
  color:#fff;
  text-decoration:underline;
  margin:0 8px;
  font-weight:400;
  font-size:24px;
  line-height:150%
}

.options>a:first-of-type{
  margin-right:30px
}

.video-container{
  display:flex;
  position:relative;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  padding:0;
  font-style:normal;
  width: 56.25%;
}

.video>a>button{
  background:#f6821f;
  border-radius:4px;
  border:none;
  width:180px;
  margin-top:78px;
  height:55px;
  color:#fff;
  text-align:center;
  font-weight:600;
  font-size:16px;
  line-height:19px;
  background:#f6821f;
  box-shadow:0 0 0 0 rgba(0,0,0,.25);
  cursor:pointer
}

.video {
	position: relative;
	padding-bottom: 56.25%;
  width: 100%;
	height: 0;
}

.video iframe{
  border-color:#ff8c00 transparent;
  position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@media screen and (max-width:1024px){
  .container{
      background-size:contain;
      background-position-y:center
  }
}

@media screen and (max-width:600px){
  .container{
      background-size:contain;
      background-position-y:center
  }
  pre{
      font-size:.8rem;
      padding:8px 12px;
      width:100%
  }
  body{
      width:100vw
  }
  .header img{
      margin-left:0
  }
  h1{
      font-size:1.6rem
  }
  ol{
      padding-left:20px
  }
  li{
      margin-bottom:5px
  }
}
