/* Editorial Card Styles */


.Editorial_Card_Container {
    display: grid;
    align-items: auto;
    grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
    gap: 24px;
    justify-content: center;
    margin-bottom: 24px;
    padding: 0 4vw;
  }
  
  .Editorial_Card_Container .Editorial_Card {
  display: flex; 
      flex-direction: column;
      background-color: rgba(255, 255, 255, 1);
      box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.04);
      border-radius: 7px;
      border: solid;
      border-color: rgba(0, 0, 0, 0.0578);
      border-width: 1px;
      /* transition: transform ease-out 500ms;*/
      transition: 0.35s ease;
  }
  
  
  .Editorial_Card_Container .Editorial_Card .Editorial_CardImage {
      width: auto;
      height: auto;
      overflow: hidden;
      padding: 0px;
      margin-bottom: 12px;
      border-radius: 7px 7px 0px 0px;
      aspect-ratio: 16 / 9;
  }
  
  
  
  .Editorial_Card_Container .Editorial_Card .Editorial_CardImage img {
      width: 100%;
      height: 100%;
      object-fit: cover;
  }
  
  
  
  .Editorial_Card_Container .Editorial_Card .Editorial_CardInfo {
      padding: 0 2rem;
      flex: 1;
  }
  
  .Editorial_Card_Container .Editorial_Card .Editorial_CardInfo h3 {
      font-family: 'Segoe UI Variable Text Semibold', 'Segoe UI Variable Text', Segoe UI, SegoeUI, Helvetica Neue, Arial, sans-serif;
      font-weight: 400;
      font-size: 28px;
      line-height: 1.33;
      color: rgba(0, 0, 0, 0.8956);
  }
  
  .Editorial_Card_Container .Editorial_Card .Editorial_CardInfo h4 {
      font-family: 'Segoe UI Variable Text Semibold', 'Segoe UI Variable Text', Segoe UI, SegoeUI, Helvetica Neue, Arial, sans-serif;
      font-weight: 600;
      font-size: 16px;
      line-height: 1.33;
      margin-top: 4px;
      margin-bottom: 4px;
      color: rgba(0, 0, 0, 0.6063);
  }
  
  .Editorial_Card_Container .Editorial_Card .Editorial_CardInfo p {
      font-family: 'Segoe UI Variable Text Semiligh', 'Segoe UI Variable Text', Segoe UI, SegoeUI, Helvetica Neue, Arial, sans-serif;
      margin-top: 12px;
      font-size: 16px;
      line-height: 22px;
      font-weight: normal;
      padding: 0 0;
  }
  
  .Editorial_Card_Container .Editorial_Card .btn {
     display:flex;
      flex-direction: row;
      justify-content: center;
      padding: 12px 24px 12px 24px;
      margin: 36px 24px 24px 24px;
      cursor: pointer;
      border-radius:4px;
      background-color: rgba(0, 95, 184, 1);
      transition: background-color 0.3s ease-out;
      align-items: center;
  
  }
  
  .Editorial_Card_Container .Editorial_Card .btn a {
    font-family: Segoe UI Variable, Segoe UI, Frutiger, Frutiger Linotype, Dejavu Sans, Helvetica Neue, Arial, sans-serif;
      text-decoration: none;
      padding-left:8px;
      color: #fff;
      font-size: 14px;
      line-height:20px;
      border-radius: 4px;
      text-align: left;
      font-weight: normal;
      overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  
  
  
  .Editorial_Card_Container .Editorial_Card .btn:hover {
      background-color: rgba(0, 95, 184, 0.9);
  }
  .Editorial_Card_Container .Editorial_Card:hover {
      box-shadow: 0 12px 40px 2px rgba(0, 0, 0, 0.05);
      border-radius: 8px;
  
      transform: translate(0, -4px);
  }
  
  /* Icon Footer Styles */
  
  .Footer_Icon_Container {
    display: grid;
    align-items: auto;
    grid-template-columns: repeat(auto-fit, minmax(48px, 64px));
    justify-content: center;
    justify-items: center;
    gap: 48px;
    margin-bottom: 24px;
    padding: 0 4vw;
  }
  
  .Footer_Icon_Container .AppIcon {
    min-height: 48px;
    min-width: 48px;
    max-width: 64px;
    max-height: 64px;
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.0578);
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.04);
    aspect-ratio: 1 / 1;
    transition: box-shadow 350ms ease-out;
  }
  
  .Footer_Icon_Container .AppIcon:hover {
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
    
  }
  
  
  
  /* END ICON FOOTER STYLES */
  
  /* ---- PORTRAIT MEDIA CARD------ */
  
  .Editorial_Card_Container .Portrait_Media_Card {
    display: flex;
    flex-direction: column;
    background-color: rgba(255, 255, 255, 1);
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.04);
    transition: transform ease-out 350ms;
    /* transition: 0.35s ease; */
  }
  
  .Editorial_Card_Container .Portrait_Media_Card .gradient {
    flex: 1;
    position: relative;
    display: flex;
    flex-direction: column;
    margin-top: -15%;
    z-index: 1;
    bottom: 0px;
    background: linear-gradient(to top, rgba(0, 0, 0, 1) 95%, transparent 100%);
    border-radius: 0px 0px 7px 7px;
  }
  
  .Editorial_Card_Container .Portrait_Media_Card .Portrait_Card_Image {
    width: auto;
    height: auto;
    overflow: hidden;
    padding: 0px;
    margin-bottom: 12px;
    border-radius: 7px 7px 0px 0px;
    aspect-ratio: 16 / 9;
    z-index: 1;
  }
  
  .Editorial_Card_Container .Portrait_Media_Card .Portrait_Card_Image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .Editorial_Card_Container .Portrait_Media_Card .Portrait_CardInfo {
    flex: 1;
    z-index: 2;
  
    padding: 24px 24px 0px 24px;
  
    border-radius: 8px;
  }
  
  .Editorial_Card_Container .Portrait_Media_Card .Portrait_CardInfo h3 {
    font-family: Segoe UI Variable, Segoe UI, Frutiger, Frutiger Linotype,
      Dejavu Sans, Helvetica Neue, Arial, sans-serif;
    font-weight: 600;
    font-size: 28px;
    line-height: 1.33;
    margin-top: 4px;
    margin-bottom: 4px;
    color: rgba(255, 255, 255, 0.8956);
  }
  
  .Editorial_Card_Container .Portrait_Media_Card .Portrait_CardInfo h4 {
    font-family: Segoe UI Variable, Segoe UI, Frutiger, Frutiger Linotype,
      Dejavu Sans, Helvetica Neue, Arial, sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 1.33;
    margin-top: 4px;
    margin-bottom: 4px;
    color: rgba(255, 255, 255, 0.6063);
  }
  
  .Editorial_Card_Container .Portrait_Media_Card .Portrait_CardInfo p {
    font-family: Segoe UI Variable, Segoe UI, Frutiger, Frutiger Linotype,
      Dejavu Sans, Helvetica Neue, Arial, sans-serif;
    margin-top: 12px;
    font-size: 16px;
    line-height: 22px;
    font-weight: 400;
    padding: 0 0;
    color: rgba(255, 255, 255, 0.8956);
  }
  
  .Editorial_Card_Container .Portrait_Media_Card .btn {
    display: flex;
    flex-direction: row;
    justify-content: center;
    padding: 12px 24px 12px 24px;
    margin: 12px 24px 24px 24px;
    cursor: pointer;
    border-radius: 4px;
    background-color: rgba(0, 95, 184, 1);
    transition: background-color 0.3s ease-out;
    align-items: center;
  }
  
  .Editorial_Card_Container .Portrait_Media_Card .btn a {
    font-family: Segoe UI Variable, Segoe UI, Frutiger, Frutiger Linotype,
      Dejavu Sans, Helvetica Neue, Arial, sans-serif;
    text-decoration: none;
    padding-left: 8px;
    color: #fff;
    font-size: 14px;
    line-height: 20px;
    border-radius: 4px;
    text-align: left;
    font-weight: normal;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  
  .Editorial_Card_Container .Portrait_Media_Card .btn:hover {
    background-color: rgba(0, 95, 184, 0.9);
  }
  .Editorial_Card_Container .Portrait_Media_Card:hover {
    box-shadow:0px 2px 4px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    z-index: 9;
    transform: translateY(-8px);
  }
  
  /*  END PORRAIT MEDIA CARD */
  
  
  /* immersive cards */
  
  
  .Editorial_Card_Container .Immersive_Card {
      background: grey;
      display: flex;
  
      position: relative;
      align-items: flex-end;
      overflow: hidden;
      border-radius: 8px;
      transition: 0.5s ease;
  }
  
  .Editorial_Card_Container .Immersive_Card:before {
      content: "";
      display: block;
      height: 100%;
      width: 100;
      padding-bottom: calc(9/16 * 100%);
      border-radius: 8px;
      background: #000;
      z-index: 2;
      opacity: 0;
  }
  
  .Editorial_Card_Container .Immersive_Card .image {
  
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      border-radius: 8px;
  }
  
  .Editorial_Card_Container .Immersive_Card .image img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      border-radius: 8px;
  
  }
  
  /* Max char limit is 98 W's */
  .Editorial_Card_Container .Immersive_Card .info {
      display: flex;
      flex-direction: column;
      position: relative;
      width: 100%;
      height: 100%;
      margin: 0px;
      overflow: hidden;
      z-index: 3;
      color: white;
      opacity: 0;
      border-radius: 6px;
      border-color:rgba(255,255,255,.85);
      transform: translateY(30px);
      background: url(/wp-content/uploads/2022/03/noise.png), rgba(252, 252, 252, 0.85);
      background-blend-mode: normal, luminosity;
      -webkit-backdrop-filter: blur(60px);
      backdrop-filter: blur(60px);
      transition: opacity 0.5s ease;
      justify-content: flex-end;
  }
  
  
  
  .Editorial_Card_Container .Immersive_Card .info h3 {
      font-family: Segoe UI Variable, Segoe UI, Frutiger, Frutiger Linotype, Dejavu Sans, Helvetica Neue, Arial, sans-serif;
      font-weight: 600;
      font-size: 28px;
      line-height: 1.33;
      color: rgba(0, 0, 0, 0.8956);
      margin: 24px 12px 0px 24px;
  }
  
  .Editorial_Card_Container .Immersive_Card .info h4 {
      font-family: Segoe UI Variable, Segoe UI, Frutiger, Frutiger Linotype, Dejavu Sans, Helvetica Neue, Arial, sans-serif;
      font-weight: 600;
      font-size: 16px;
      line-height: 1.33;
      margin-top: 4px;
      margin-bottom: 4px;
      color: rgba(0, 0, 0, 0.6063);
      margin: 0px 4px 12px 24px;
  }
  
  .Editorial_Card_Container .Immersive_Card .info p {
      font-family: Segoe UI Variable, Segoe UI, Frutiger, Frutiger Linotype, Dejavu Sans, Helvetica Neue, Arial, sans-serif;
      margin-top: 12px;
      font-size: 14px;
      line-height: 1.33;
      font-weight: normal;
      color: rgba(0, 0, 0, 0.8956);
      margin: 0px 12px 12px 24px;
      padding:0px;
  }
  
  
  
  .Editorial_Card_Container .Immersive_Card .info .btn {
      display: flex;
      flex-direction: row;
      justify-content: center;
      padding: 4px;
      margin: 12px 24px 24px 24px;
      cursor: pointer;
      border-radius: 4px;
      background-color: rgba(0, 95, 184, 1);
      transition: background-color 0.3s ease-out;
      align-items: center;
  }
  
  .Editorial_Card_Container .Immersive_Card .info .btn a {
      font-family: Segoe UI Variable, Segoe UI, Frutiger, Frutiger Linotype, Dejavu Sans, Helvetica Neue, Arial, sans-serif;
      text-decoration: none;
      padding-left: 8px;
      color: #fff;
      font-size: 14px;
      line-height: 20px;
      border-radius: 4px;
      padding: 4px;
      text-align: left;
      font-weight: normal;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
  }
  
  .Editorial_Card_Container .Immersive_Card .info .btn:hover {
      background-color: rgba(0, 95, 184, 0.9);
  
  }
  
  .Editorial_Card_Container .Immersive_Card:hover  .Immersive_Card:focus  .Immersive_Card:active{
      box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
    /*  z-index: 9;
      transform: translateY(-4px);
    transform: scale(1.01);*/
      transform: translateY(-4px);
  
  }
  
  .Editorial_Card_Container .Immersive_Card:hover:before  .Immersive_Card:focus:before  .Immersive_Card:active:before{
      opacity: 1;
  
  
  }
  
  .Editorial_Card_Container .Immersive_Card .info:hover {
      opacity: 1;
      transform: translateY(0px);
  }
  
  .Editorial_Card_Container .Immersive_Card .info:active {
      opacity: 1;
      transform: translateY(0px);
  }
  
  .Editorial_Card_Container .Immersive_Card .focus:active {
      opacity: 1;
      transform: translateY(0px);
  }
  
  
  
  /*End immersive cards*/
  
  /* Immersive Row Styles*/
  
  .Editorial_Card_Container .Immersive_Row_Item {
    display: flex;
    flex-direction: column;
  }
  
  .Editorial_Card_Container .Immersive_Row_Item .Immersive_Row_CardImage {
    width: auto;
    height: auto;
    overflow: hidden;
    padding: 0px;
    margin-bottom: 12px;
    border-radius: 8;
    aspect-ratio: 16 / 9;
    
  }
  
  .Editorial_Card_Container .Immersive_Row_Item .Immersive_Row_CardImage img {
    width: 100%;
    height: 100%;
    border-radius: 8px;
    object-fit: cover;
    
  }
  
  
  .Editorial_Card_Container .Immersive_Row_Item .AppDetailswrapper-middle {
      flex:1;
    display: flex;
    align-items: center;
    padding: 12px;
    /* Light/Stroke/Card Stroke/Default */
  border: 1px solid rgba(0, 0, 0, 0.0578);
  border-radius: 7px;
    background: rgba(255, 255, 255, 0.4);
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
      margin:0px
  
  }
  
  .Editorial_Card_Container .Immersive_Row_Item .AppMetaData {
    flex: 1;
    min-width: 120px;
    
  }
  .Editorial_Card_Container .Immersive_Row_Item .AppTitle {
    display: block;
    display: -webkit-box;
    margin: 0 24px;
    margin-top: 0px;
    margin-bottom: 0px;
    font-weight: bold;
    line-height: 1.5;
    min-width: 110px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .Editorial_Card_Container .Immersive_Row_Item  .AppBlock {
    padding: 0 24px;
    margin-top: 0px;
    margin-bottom: 0px;
  }
  
  .Editorial_Card_Container .Immersive_Row_Item  .CardButtonBlock {
    padding: 0;
    margin-top: 0px;
    margin-bottom: 0px;
  }
  .Editorial_Card_Container .Immersive_Row_Item  .AppLegalText {
    padding: 0 24px;
    margin-top: 0px;
    margin-bottom: 0px;
    opacity: 0.8;
    font-size: small;
  }
  .Editorial_Card_Container .Immersive_Row_Item .AppIcon {
    min-height: 48px;
    min-width: 48px;
  max-width: 64px;
  max-height: 64px;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    border-radius: 4px;
    aspect-ratio: 1 / 1;
  }
  .Editorial_Card_Container .Immersive_Row_Item  .AppTitle::after {
    content: "\a";
    white-space: pre;
  }
  
  .Editorial_Card_Container .Immersive_Row_Item  h3 {
    font-family: Segoe UI Variable, Segoe UI, Frutiger, Frutiger Linotype,
      Dejavu Sans, Helvetica Neue, Arial, sans-serif;
    font-weight: 600;
    font-size: 28px;
    line-height: 1.33;
    margin-top: 4px;
    margin-bottom: 4px;
    color: rgba(0, 0, 0, 0.8956);
  }
  
  .Editorial_Card_Container .Immersive_Row_Item  h4 {
    font-family: Segoe UI Variable, Segoe UI, Frutiger, Frutiger Linotype,
      Dejavu Sans, Helvetica Neue, Arial, sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 1.33;
    margin-top: 4px;
    margin-bottom: 4px;
    color: rgba(0, 0, 0, 0.6063);
  }
  
  .Editorial_Card_Container .Immersive_Row_Item  p {
    font-family: Segoe UI Variable, Segoe UI, Frutiger, Frutiger Linotype,
      Dejavu Sans, Helvetica Neue, Arial, sans-serif;
    margin-top: 12px;
    font-size: 16px;
    line-height: 22px;
    font-weight: 400;
    padding: 0 0;
  }
  
  .Editorial_Card_Container .Immersive_Row_Item .AppDetailswrapper-middle .btn {
    display: flex;
    flex-direction: row;
    justify-content: center;
    padding: 12px 24px 12px 24px;
    margin: 12px;
    cursor: pointer;
    border-radius: 4px;
    background-color: rgba(0, 95, 184, 1);
    transition: background-color 0.3s ease-out;
    align-items: center;
    overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;
  }
  
  .Editorial_Card_Container .Immersive_Row_Item .AppDetailswrapper-middle
    a {
    font-family: Segoe UI Variable, Segoe UI, Frutiger, Frutiger Linotype,
      Dejavu Sans, Helvetica Neue, Arial, sans-serif;
    text-decoration: none;
    padding-left: 8px;
    color: #fff;
    font-size: 14px;
    line-height: 20px;
    border-radius: 4px;
    text-align: left;
    font-weight: normal;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  
  .Editorial_Card_Container .Immersive_Row_Item .AppDetailswrapper-middle .btn:hover {
    background-color: rgba(0, 95, 184, 0.9);
  }
  
  /* END IMMERSIVE ROW STYLES */
  
  
  /* CARD BADGE STYLES */
  
   
   .Editorial_Card_Container .Editorial_Card_Badge {
   display: flex; 
       flex-direction: column;
       /*background-color: rgba(255, 255, 255, 1);*/
       background: rgba(246, 246, 246, 0.5);
       box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.04);
       border-radius: 7px;
       border: solid;
       border-color: rgba(0, 0, 0, 0.0578);
       border-width: 1px;
       /* transition: transform ease-out 500ms;*/
       transition:  0.35s ease;
   }
   
   
   .Editorial_Card_Container .Editorial_Card_Badge .Editorial_CardImage {
       width: auto;
       height: auto;
       overflow: hidden;
       padding: 0px;
       margin: 12px;
       border-radius: 8;
       aspect-ratio: 16 / 9;
   }
   
   
   
   .Editorial_Card_Container .Editorial_Card_Badge .Editorial_CardImage img {
       width: 100%;
       height: 100%;
       object-fit: cover;
       border-radius: 8px;
       
   }
   
   
   
   .Editorial_Card_Container .Editorial_Card_Badge .Editorial_CardInfo {
       padding: 0 2rem;
       flex: 1;
   }
   
   .Editorial_Card_Container .Editorial_Card_Badge .Editorial_CardInfo h3 {
       font-family: Segoe UI Variable, Segoe UI, Frutiger, Frutiger Linotype, Dejavu Sans, Helvetica Neue, Arial, sans-serif;
       font-weight: 600;
       font-size: 24px;
       line-height: 1.33;
       margin:0px;
       color: rgba(0, 0, 0, 0.8956);
   }
   
   .Editorial_Card_Container .Editorial_Card_Badge .Editorial_CardInfo h4 {
       font-family: Segoe UI Variable, Segoe UI, Frutiger, Frutiger Linotype, Dejavu Sans, Helvetica Neue, Arial, sans-serif;
       font-weight: 600;
       font-size: 18px;
       line-height: 1.33;
       margin-top: 4px;
       margin-bottom: 4px;
       color: rgba(0, 0, 0, 0.6063);
   }
   
   .Editorial_Card_Container .Editorial_Card_Badge .Editorial_CardInfo p {
       font-family: Segoe UI Variable, Segoe UI, Frutiger, Frutiger Linotype, Dejavu Sans, Helvetica Neue, Arial, sans-serif;
       margin-top: 12px;
       font-size: 16px;
       line-height: 22px;
       font-weight: lighter;
       padding: 0 0;
   }
   
   .Editorial_Card_Container .Editorial_Card_Badge .btn {
      display:flex;
       flex-direction: row;
       justify-content: center;
       padding: 12px 24px 12px 24px;
       margin: 36px 24px 24px 24px;
       cursor: pointer;
       border-radius:4px;
       background-color: rgba(0, 95, 184, 1);
       transition: background-color 0.3s ease-out;
       align-items: center;
   
   }
   
   .Editorial_Card_Container .Editorial_Card_Badge .btn a {
     font-family: Segoe UI Variable, Segoe UI, Frutiger, Frutiger Linotype, Dejavu Sans, Helvetica Neue, Arial, sans-serif;
       text-decoration: none;
       padding-left:8px;
       color: #fff;
       font-size: 14px;
       line-height:20px;
       border-radius: 4px;
       text-align: left;
       font-weight: normal;
       overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;
   }
   
   
   
   .Editorial_Card_Container .Editorial_Card_Badge .btn:hover {
       background-color: rgba(0, 95, 184, 0.9);
   }
   .Editorial_Card_Container .Editorial_Card_Badge:hover {
      box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
       border-radius: 8px;
   
       transform: translate(0, -4px);
   }
   
   
   /* END CARD BADGE STYLES */