/*:root {
	--color-first:#009be1;
	--color-second:#313f4e;
}
body{background: #f0f0f0}*/
:root{
    --color-first:#272660;
    --color-second:#ee4867;
  }
  * {box-sizing: border-box; }
  a{text-decoration: none;}
  .text-desc-limit{
      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-box-orient: vertical;
  }
  .text-desc-limit-1{-webkit-line-clamp: 1;}
  .text-desc-limit-2{-webkit-line-clamp: 2;}
  .text-desc-limit-3{-webkit-line-clamp: 3;}
  .text-desc-limit-4{-webkit-line-clamp: 4;}
  .align-items-center{align-items: center;}
  .align-items-stretch{align-items: stretch;}
  .justify-content-center{justify-content: center;}
  .coupon-section,.accordion-section{
      width: 100%;
      padding: 20px 0px;
      font-size: 16px;
  }
  .coupon-row{
      width: 100%;
      display: flex;
      flex-wrap: wrap;	
  }
  .coupon-details-block .merchant-logo,.coupon-details-block .merchant-details-title,
  .coupon-details-block .merchant-details-desc,.coupon-offers-info,.coupon-details{margin: 0;}
  .coupon-left-section,.coupon-offers-info,.coupon-details,.coupon-details-block,
  .coupon-details-button{flex: 0 0 auto;max-width: 100%;}
  .coupon-details-block,.coupon-center-section{ width: 66.66666667%;}
  .coupon-left-section{ width: 100%;}
  .coupon-block{ background: #f8f8f8;margin-bottom: 10px;}
  .coupon-offers-info{ 
      width: 25%; 
      background: #f9fafd;
      border-radius: 4px 0 0 4px;	
      border-right: 1px solid #e8eef7;
      display: flex;
      flex-direction: column;
      padding:10px 20px;
      text-align: center;
      justify-content: center;
  }
  .pb-6{padding-bottom: 6rem;}
  .coupon-details{
      width: 75%;
      padding: 20px;
      background-color: #f8f8f8;
  }
  .coupon-details-button{width:33.33333333%; display: flex; justify-content: flex-end;}
  .coupon-merchant-logo{
      width:100px;
      height:80px;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: 0 auto;
  }
  .coupon-merchant-logo img{width: 100%;object-fit: scale-down;}
  .offer-text{
      margin:5px 0;
      text-align: center;
      font-size: 2.2rem;
      font-weight: 600;
      line-height: 20px;
      color: var(--color-first);
  }
  .offer-text span{ font-size: 1.2rem;vertical-align:middle; }
  .offer-code,.merchant-logo-name{
      font-size: 0.9rem;
    font-weight: 600;
      color:#7f949f;
      margin: 0px;
      line-height: 20px;
      text-transform: uppercase;
  }
  .coupon-details-block .merchant-logo-name{text-transform: capitalize;}
  .coupon-details-block .merchant-details-title{
      font-size: 1.5rem;
      margin: 10px 0;
      color: var(--color-first);
      font-weight: 700;
      line-height: 30px;
  }
  .coupon-details-block .merchant-details-desc{
      color: #333;
      font-size: 1.1rem;
      line-height: 20px;
    font-weight: 500;
  }
  .btn-reveal {
      min-width: 150px;
      padding-right: 30px;
      position: relative;
      transition: padding .1s;
      cursor: pointer;
  }
  .btn-reveal .code, .btn-reveal .code.small {
      color: #2d3e50;
      font-family: monospace;
      font-weight: 700;
      letter-spacing: -1px;
      line-height: 32px;
  }
  .btn-reveal .code {
      align-items: center;
      background-color: #f0faff;
      border: 2px dashed var(--color-first);
      border-radius: 3px;
      display: flex;
      font-size: 22px;
      height: 100%;
      justify-content: flex-end;
      overflow: hidden;
      padding-right: 10px;
      position: absolute;
      white-space: nowrap;
      width: 100%;
  }
  .btn-reveal .cover {
      background-color: var(--color-first);
      border-radius: 3px;
      color: #fff;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0;
      line-height: 16px;
      padding: 15px 25px;
      position: relative;
      text-align: center;
      text-transform: uppercase;
      transition: padding .1s;
      white-space: nowrap;
  }
  .btn-reveal:focus-visible {outline: 1px solid #009be1;}
  .btn-reveal:active,.btn-reveal:focus,.btn-reveal:hover {padding-right: 60px;}
  .btn-reveal:active .cover,.btn-reveal:focus .cover,.btn-reveal:hover .cover {
      background-color:var(--color-first);
      padding: 15px 21px;
  }
  .btn-reveal.revealed {padding-right: 0;}
  .btn-reveal.revealed .cover {display: none}
  .btn-reveal.revealed .code {
      display: block;
      justify-content: center;
      padding: 5px;
      position: static;
      text-overflow: ellipsis;
  }
  .btn-reveal .code.small { font-size: 16px }
  .btn-reveal .code.tiny {
      color: #2d3e50;
      font-family: monospace;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: -1px;
      line-height: 32px;
  }
  .accordion_faqs {
    width: 100%;
    margin: 0 auto;
    border-radius: 8px;
    overflow: hidden;
  }
  .accordion_faqs__header { padding: 0.625rem; }
  .accordion_faqs__title {
    font-size: 1.75rem;
    color: var(--color-dark);
    text-align: center;
  }
  .accordion_faqs__items {
    display: grid;
    padding: 12px;
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .accordion_faqs__item {
    width: 100%;
    padding:1.5rem 1rem;
    background-color: #fff;
    border-radius:  4px;
  }
  .accordion_faqs__item[open] .accordion_faqs__item-question {
    border-bottom:  1px solid #aaa;
    margin-bottom:  12px;
  }
  .accordion_faqs__item[open] .accordion_faqs__item-question::after { transform: rotate(180deg); }
  .accordion_faqs__item[open] .accordion_faqs__item-question ~ * { animation: openQuestion 0.5s ease-in-out; }
  .accordion_faqs__item-question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    list-style: none;
    cursor: pointer;
    padding: 0.25rem 0;
    font-size: 1.2rem;
    font-weight: 600;
  }
  .accordion_faqs__item-question:focus{background: transparent;border: 0;outline: 0;box-shadow:none }
  .accordion_faqs__item-question::after {
    content: "";
    display: block;
    min-width: 18px;
    height: 10px;
    background: url("../img/arrow.svg") no-repeat;
    transition: 0.2s;
    padding-left: 10px;
  }
  .accordion_faqs__item-answer {
    font-size: 1rem;
    line-height: 1.6em;
  }
  @keyframes openQuestion {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }
  @media only screen and (max-width:1024px){
       .btn-reveal{min-width: 120px}
  }
  @media only screen and (max-width:992px){
       .coupon-details-block,.coupon-details-button,.coupon-left-section,.coupon-center-section{width: 100%}
       .coupon-details-button{justify-content: flex-start;margin-top: 10px}
       .btn-reveal .cover{padding: 10px 25px;}
       .coupon-details{padding: 10px}
       .coupon-details-block .merchant-details-title{font-size: 1.3rem}
       .coupon-details-block .merchant-details-desc{font-size: 1rem}
  }
  @media only screen and (max-width:768px){
      .coupon-left-section,.coupon-center-section{width: 100%}
      .coupon-offers-info,.coupon-details{width: 100%;padding:10px}
      .offer-text{margin: 7px 0}
      .btn-reveal{padding-right: 45px}
      .coupon-section, .accordion-section{padding: 20px 0px}
      .accordion_faqs__items{padding: 0}
    .coupon-details-block{text-align: center;}
    .coupon-details-button{justify-content: center;}
  }
  @media only screen and (max-width:600px){
      .coupon-block{padding:0px}
      .coupon-offers-info{border-right: 0}
      .accordion_faqs__item{padding: 1rem 0.5rem}
  }