/* ============================================================
   download page styles - cloned layout of lightxtremevpn.com/download
   (values ported from the original page stylesheet)
   ============================================================ */
.dl-page h1 { padding: 50px 24px 0; margin: 0; color: #262626; font-size: 45px; font-weight: 700; text-align: center; }
.dl-page .refund-p { display: flex; align-items: center; justify-content: center; padding: 15px; color: #969696; font-size: 16px; font-weight: 600; letter-spacing: 3px; text-align: center; }
.dl-page .refund-p img { width: 25px; height: 25px; margin-right: 5px; }
.dl-page .hidden { display: none; }

/* feature block */
.dl-page .download-part1 { display: flex; justify-content: space-between; max-width: 1140px; margin: auto; padding: 10px 15px; }
.dl-page .download-part1 > div:first-child { flex: 1; }
.dl-page .download-part1 h2 { margin: 0; text-align: left; font-size: 30px; }
.dl-page .download-part1-text { display: flex; font-size: 14px; line-height: 1.8; }
.dl-page .download-part1-text img { flex: 0 0 auto; width: 16px; height: 16px; margin: 5px 5px 0 0; }
.dl-page .download-part1-img { width: 500px; height: 431px; flex: 0 0 500px; }
.dl-page .download-part1-img img { width: 100%; height: 100%; object-fit: contain; }
.dl-page .download-part1-free { width: 260px; }
.dl-page .version { color: #373d3f; font-size: 12px; font-weight: 400; text-align: center; }
.dl-page .download-a { display: inline-block; width: 220px; }

/* primary gradient button */
.dl-page .lightningXBtn1 { display: inline-block; min-width: 160px; margin: 10px 10px 10px 0; padding: 10px 20px; border-radius: 30px; background: linear-gradient(90deg, #ffbd1a 4%, #ffe71a 98%); color: #262626; font-weight: 700; text-align: center; cursor: pointer; transition: .3s; }
.dl-page .lightningXBtn1:hover { background: linear-gradient(90deg, #f90 3%, #ffe400); color: #262626; }

/* platform switcher */
.dl-page .download-platform { width: 100%; border-top: 1px solid rgba(165, 186, 193, .28); border-bottom: 1px solid rgba(165, 186, 193, .28); }
.dl-page .platform { display: flex; flex-wrap: wrap; justify-content: space-around; max-width: 1140px; margin: 25px auto; padding: 0 10px; line-height: 30px; }
.dl-page .platformSon { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100px; height: 100px; border-radius: 20px; color: inherit; cursor: pointer; transition: all .3s ease; }
.dl-page .platformSon img { width: 36px; height: 36px; margin-bottom: 10px; object-fit: contain; }
.dl-page .platformSon div { font-size: 13px; font-weight: 700; }
.dl-page .platformSon:hover { background: rgba(255, 142, 21, .12); color: #ff8e15; }
.dl-page .platformSonActive { background: rgba(255, 142, 21, .12); }
.dl-page .platformSonSelected { color: #ff8e15; }

/* 3 steps */
.dl-page .step { max-width: 1140px; min-height: 300px; margin: auto; padding: 80px 15px; text-align: center; }
.dl-page .step h2 { margin: 0 0 10px; color: #262626; font-size: 26px; text-align: center; }
.dl-page .step-item { display: flex; text-align: center; }
.dl-page .download-step-item { width: 520px; }
.dl-page .download-step { width: 60px; height: 30px; margin: 0 auto; border: 1px solid #ff8e15; border-radius: 25px; background: #ff8e15; color: #fff; font-weight: 700; line-height: 30px; }
.dl-page .download-step-item h3 { margin: 16px 0 0; color: #262626; font-size: 16px; font-weight: 700; }
.dl-page .download-step-item p { margin: 20px 0 20px; font-size: 14px; color: #5b626b; }
.dl-page .step-arrow { flex: 1; display: flex; align-items: center; justify-content: center; }
.dl-page .step-arrow img { width: 100%; max-width: 200px; opacity: .55; }

/* FAQ */
.dl-page .download-question { max-width: 1140px; margin: 0 auto 80px; padding: 0 15px; }
.dl-page .download-question h2 { margin-bottom: 10px; color: #262626; font-size: 26px; text-align: center; }
.dl-page .questionColl { overflow: hidden; margin: 10px auto; padding: 26px 10px; border: 1px solid #eaeaea; border-radius: 20px; background: #fff; color: #3d3d3d; font-size: 15px; font-weight: 600; cursor: pointer; user-select: none; transition: .5s ease-in-out; }
.dl-page .questionColl-top-box { display: flex; align-items: center; justify-content: space-between; padding: 0 16px; }
.dl-page .questionColl-titel { color: rgba(0, 0, 0, .88); font-size: 15px; font-weight: 600; }
.dl-page .questionColl-top-box img { width: 30px; height: 30px; flex: 0 0 30px; cursor: pointer; }
.dl-page .questionColl p { display: none; margin: 14px 0 0; padding: 0 16px; color: #5b626b; font-size: 14px; font-weight: 400; line-height: 21px; }
.dl-page .questionColl-active { max-height: 1000px; border-color: #ff8e15 !important; background: #fff; box-shadow: 0 10px 30px rgba(255, 154, 46, .44); }
.dl-page .questionColl-active p { display: block; }
.dl-page .questionColl:hover { border-color: #ff8e15 !important; border-radius: 20px; box-shadow: 0 10px 30px rgba(255, 154, 46, .44); }

@media (max-width: 1024px) {
  .dl-page .download-part1 { display: block; }
  .dl-page .download-step-item { width: auto; }
  .dl-page .download-part1-img { width: auto; height: auto; flex: none; }
  .dl-page .step-item { display: block; }
  .dl-page .step-arrow { display: none; }
  .dl-page .platformSon { width: 80px; height: 80px; font-size: 13px; }
}
@media (max-width: 768px) {
  .dl-page h1 { padding: 24px 15px 0; font-size: 30px; }
  .dl-page .refund-p { padding: 20px 15px 0; font-size: 14px; letter-spacing: 2px; }
  .dl-page .refund-p img { width: 18px; height: 18px; }
  .dl-page .download-part1 { display: block; }
  .dl-page .download-part1 h2 { margin: 20px 0; font-size: 22px; text-align: center; }
  .dl-page .download-part1-img { display: none; }
  .dl-page .download-part1-free { width: 100%; text-align: center; }
  .dl-page .download-a { width: 90%; margin: 10px 0; font-size: 16px; }
  .dl-page .step { padding: 20px 15px; }
  .dl-page .step h2 { font-size: 20px; }
  .dl-page .step h3 { margin-top: 20px; }
  .dl-page .download-question { margin-bottom: 40px; }
  .dl-page .download-question h2 { font-size: 20px; }
  .dl-page .platform { width: 95%; justify-content: space-between; padding: 0; }
  .dl-page .platformSon { width: 100px; height: 100px; margin-top: 10px; font-size: 13px; }
  .dl-page .platformSon img { width: 26px; height: 26px; margin-bottom: 2px; }
  .dl-page .questionColl { padding: 20px 8px; }
}
