/*------------------------------------------------/
              Variables
--------------------------------------------------*/
:root {
  --section-1: 1;
  --section-1-bg: var(--section-1);
  --section-2: 2;
  --section-2-bg: var(--section-2) / calc(var(--section-2)+2);
  --section-3: 4;
  --section-3-bg: var(--section-3) / calc(var(--section-3)+2);
  --section-4: ;
  --section-4-bg: ;
  --section-5: ;
  --section-5-bg: ;
}

/*--------------------------------------------------
                     HTML5 Reset
 --------------------------------------------------*/
html, body, div, section, article, aside, header,
hgroup, footer, nav, h1, h2, h3, h4, h5, h6, p,
blockquote, address, time, span, em, strong, img,
ol, ul, li, figure, canvas, video, th, td, tr {
  margin: 0;
  padding: 0;
  border: 0;
}

address, article, aside, canvas, details, figcaption,
figure, footer, header, hgroup, menu, nav, section, summary, img {
  display: block;
}

*, *:before, *:after {
    box-sizing: border-box;
}

ul {
  list-style-type: none;
}

a {
  text-decoration: none;
}

a:hover {
  color: white;
}

picture {
  z-index: 1;
  display: grid;
}

.container {
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/*--------------------------------------------------
     removed white space glich in RD's module
 --------------------------------------------------*/

.toptop_banner.full,
.nav_mobile.submenu_nav {
  float: left;
  width: 100%;
  margin-bottom: 0;
}

.pd_purchase_left #purchase_title {
    top: -33px;
}


/*--------------------------------------------------
                        Fonts
 --------------------------------------------------*/


h1, h2, h3, h4, h5 {
  font-family: 'Roboto', sans-serif;
}

h2 {
  font-size: 2.6rem;
  font-weight: 600;
}

h3 {
  font-size: clamp(1.8rem, 2vw, 33px);
  font-weight: 600;
}

h2,h3, p {
  color: white;
  line-height: 2.6rem;
}

p {
  font-size: 1.2rem;
  line-height: 2rem;
  font-family: sans-serif;
  font-weight: 100;
}


/*--------------------------------------------------
            Japan only style "software labels"
 --------------------------------------------------*/

.center-labels {
  display: flex;
  justify-content: center;
 }

span.standard,
span.pro,
span.ultra,
span.sub {
  display: block;
  float: left;
  padding: 0.2em 1.5em 0.2em 1.5em;
  font-size: 0.9em;
  color: #fff;
  margin-right: 0.5em;
  margin-bottom: 5px;
}

span.standard {
  background: #0c9784;
}

span.pro {
  background: #0c7cba;
}

span.ultra {
  background: #821d7e;
}

span.sub {
  background: black;
  outline-width: 1px;
  outline-style: solid;
  outline-color: #444444;
}

sup {
    font-size: 73%;
    /*font-style: italic;*/
    /*opacity: 0.4;*/
}


/*--------------------------------------------------
                  Mobile first layout
 --------------------------------------------------*/

#main-grid {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  overflow: hidden;
}

#main-grid img {
  width: 100%;
}

#main-grid > div {
  padding: 2rem 1.5rem;
  height: fit-content;
}

    /*=====   logos   ======*/

#def-logos,
#disc-logos,
#codec-logos,
#sound-logos,
#casting-logos {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding-top: 0.5rem;
}

#def-logos,
#disc-logos,
#sound-logos,
#casting-logos {
  max-width: 340px;
}

#def-logos img,
#disc-logos img,
#sound-logos img {
  width: calc(100% / 3.4);
}

#def-logos img,
#disc-logos img {
  max-width: 112px;
}

.cta-btns {
  margin-top: 1rem;
  width: 100%;
  display: flex;
  text-align: center;
  font-family: 'Roboto';
  font-weight: 600;
  justify-content: space-between;
  gap: 1rem;
}

.cta-btns a {
  padding: 15px 30px;
  border-radius: 8px;
  flex: 1;
  cursor: pointer;
  transition: all 0.2s;
}

.cta-btns a:hover {
  transform: scale(1.05);
}

.cta-btns a:nth-of-type(1) {
  color: #1f006c;
  background: white;
  max-width: 48%;
}

.cta-btns a:nth-of-type(2) {
  color: white;
  background: #5900ce;
}

      /*=====   Play Button   ======*/

.video-btn:after,
.video-btn:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
}

.video-btn:after {
  width: 0;
  height: 0;
  border: 1.3em solid transparent;
  border-left: 2em solid white;
  margin-top: -1.25em;
  margin-left: -0.7em;
}

.video-btn:before {
  width: 5.6em;
  height: 5.6em;
  margin-left: -2.8em;
  margin-top: -2.8em;
  border: 3px solid white;
  border-radius: 50%;
  box-shadow: 0 0 24px #000000c7;
  background: #0000008c;
}

.video-btn:hover:before {
  background: #7d2dd2;
  transition: all 0.45s ease;
}

.video-btn:hover:before,
.video-btn:hover:after {
  transform: scale(1.05);
}


/*--------------------------------------------------
           Home cinema at his finest section
 --------------------------------------------------*/

#home-cinema, #playback, #premium-experience {
  background: #000;
}


/*--------------------------------------------------
           Blu-ray & DVD Playback section
 --------------------------------------------------*/

#disc-logos {
  justify-content: flex-start;
  opacity: 0.5;
}

#disc-logos img {
 padding-right: 6%;
}

#enhanced-blu-ray {
  background: #332980;
}

/*--------------------------------------------------
           All Formats Supported section
 --------------------------------------------------*/

 #ai-tools, #all-formats, #supported-formats {
   background: #1f006c;
 }

 #codec-logos {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   align-items: center;
   gap: 15px;
 }

#codec-logos b {
   font-family: 'Roboto';
   font-size: 1rem;
   border-radius: 8px;
   font-style: italic;
   font-weight: bolder;
   letter-spacing: 1px;
   text-align: center;
   color: #a528ff8c;
   padding: 4px 0;
   outline: 2px solid #9a61ff6e;
   width: 100%;
   cursor: context-menu;
}


/*--------------------------------------------------
           PowerDVD Reimagined section
 --------------------------------------------------*/

@keyframes stack-transition1 {
   0% {width: 100%;
       padding-top: 0%;
       transform: rotateX(0deg)
                  rotate(0deg)
                  translateY(0rem)
                  translateZ(0rem);}
 100% {width: var(--scaleEnd);
       padding-top: 20%;
       transform: rotateX(41deg)
                  rotate(-31deg)
                  translateY(4rem)
                  translateZ(var(--transZBottom));}
}

@keyframes stack-transition2 {
   0% {width: 100%;
       padding-top: 0%;
       transform: rotateX(0deg)
                  rotate(0deg)
                  translateY(0rem)
                  translateZ(0rem);}
  100% {width: var(--scaleEnd);
       padding-top: 20%;
       transform: rotateX(41deg)
                  rotate(-31deg)
                  translateY(4rem)
                  translateZ(var(--transZMiddle));}
}

@keyframes stack-transition3 {
   0% {width: 100%;
       padding-top: 0%;
       transform: rotateX(0deg)
                  rotate(0deg)
                  translateY(0rem)
                  translateZ(0rem);}
 100% {width: var(--scaleEnd);
       padding-top: 20%;
       transform: rotateX(41deg)
                  rotate(-31deg)
                  translateY(4rem)
                  translateZ(var(--transZTop));}

}

#interface {
  display: grid;
  z-index: 1;
  perspective: 100em
}

#interface img {
  grid-column: 1;
  grid-row: 1;
  width: 100%;
  --scaleEnd: 75%;
  --transZTop: 12rem;
  --transZMiddle: 9rem;
  --transZBottom: 6rem;
  margin: 0 auto;
  animation-fill-mode: forwards;
  animation-timing-function: cubic-bezier(0, 0.68, 0.5, 1.01);
  animation-iteration-count: 1;
  animation-duration: 2s;
  transform-origin: bottom;
}

#interface > img:first-of-type(1) {
  opacity: 0.4;
  animation-name: none;
}

#interface > img:first-of-type(2) {
  opacity: 0.65;
  animation-name: none;
}

#interface > img:first-of-type(3) {
  animation-name: none;
}

#interface, #reimagined {
  background: #332980;
}


/*--------------------------------------------------
           Your Movies, Your Way section
 --------------------------------------------------*/

#your-tv, #your-movies {
  background: #1f006c;
}


/*--------------------------------------------------
                TrueTheater section
 --------------------------------------------------*/

       /*=====   slides animation   ======*/

@keyframes fade-transition {
   0% {opacity: 1;}
  17% {opacity: 1;}
  25% {opacity: 0;}
  92% {opacity: 0;}
 100% {opacity: 1;}
}

#slides {
    display: grid;
    z-index: 1;
}

#slides picture {
    width: 100%;
    grid-row: 1;
    grid-column: 1;
    animation-name: fade-transition;
    animation-timing-function: ease-in;
    animation-iteration-count: infinite;
    animation-duration: 8s;
    opacity: 0;
    transition: opacity 0.1s ease;
}

#slides picture:nth-of-type(1) {
    animation-delay: 6.5s; }

#slides picture:nth-of-type(2) {
    animation-delay: 4.5s; }

#slides picture:nth-of-type(3) {
    animation-delay: 2.5s; }

#slides picture:nth-of-type(4) {
    animation-delay: 0.5s; }

#slides img {
    align-self: end;
}


       /*=====   text animation   ======*/

@keyframes words_swap {
    10% {transform: translateY(-112%);}
    25% {transform: translateY(-100%);}
    35% {transform: translateY(-212%);}
    50% {transform: translateY(-200%);}
    60% {transform: translateY(-312%);}
    75% {transform: translateY(-300%);}
    85% {transform: translateY(-412%);}
   100% {transform: translateY(-400%);}
}

.truetheater {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    overflow: hidden;
}

.words {
    height: 3.4rem;
    overflow: hidden;
    padding-left: 2%;
}

.words b {
    display: block;
    padding-top: 6%;
    height: 100%;
    animation: words_swap 8s infinite;
    background-color: white;
    background-image: linear-gradient(90deg, rgb(0 182 255) 0%, rgba(222,252,23,1) 28%, rgb(224 107 232) 46%, rgb(252 20 20) 88%);
    background-size: 100%;
    background-repeat: repeat;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -moz-background-clip: text;
    -moz-text-fill-color: transparent;
}

.words b:nth-child(1),
.words b:nth-child(5) {
   filter: drop-shadow(-3px 3px 0px #00000040);
}

.words b:nth-child(2) {
    text-shadow: 0 0 0px #fff, 0 0 2px #0025da, 0 0 0px #fff, 0 0 2px #0ff, 0 0 0px #0ff, 0 0 1px #0ff, 0 0 6px #0ff, 0 0 6px #0ff;
    font-weight: 100;
    font-style: italic;
    letter-spacing: 0.04em;
}

.words b:nth-child(3) {
   background-image: linear-gradient(45deg, #ff0000 8%, #ff7600 -22%, #b02730 37%, #ff0000 58%);
   filter: drop-shadow(-4px 3px 0px #00000082) drop-shadow(-4px 3px 0px #00000082);
   font-style: italic;
}

.words b:nth-child(4) {
    font-weight: bolder;
    letter-spacing: 1px;
    -webkit-text-stroke: 1px #ffffffd9;
    text-shadow: 3px 3px 0 #c039d1, -1px -1px 0 #6a3ea2, 1px -1px 0 #190f85, -1px 1px 0 #03b3ff, 1px 1px 0 #1d48d3;
}


      /*=====   background color   ======*/

#tt-heading, #slides, #tt-desc {
  background: #332980;
}


/*--------------------------------------------------
              Studio-Quality Audio section
 --------------------------------------------------*/


#audio-studio, #studio-quality {
  background: #1f006c;
}



/*--------------------------------------------------
                  YouTube section
 --------------------------------------------------*/

#sub-yt-grid {
  display: grid;
  grid-template-columns: 1fr;
}

#sub-yt-grid img {
  width: 100%;
  grid-column: 1;
  grid-row: 1;
}

#yt-video {
   grid-column: 1;
   grid-row: 1;
   position: relative;
   z-index: 2;
   width: 20%;
   height: 30%;
   justify-self: center;
   align-self: center;
   cursor: pointer;
}

img#yt {
  padding-top: 0.5rem;
  width: 50%;
  max-width: 200px;
  min-width: 150px;
}

#youtube, #uninterrupted {
  background: #000;
}


/*--------------------------------------------------
              Cast to any devices section
 --------------------------------------------------*/

#streaming img {
  filter: drop-shadow(2px 4px 6px #00000069)
          drop-shadow(9px 15px 10px #22146e);
}

#casting-logos img {
  width: calc(100% / 4.8);
}

#streaming, #casting-devices {
  background: #332980;
}



/*--------------------------------------------------
            Extract Trim Convert section
 --------------------------------------------------*/


@keyframes trim {
  0%   {transform: translate(0px, 220px);
        opacity: 0;}
  100% {transform: translate(0px, 0px);
        opacity: 1;}
}

#icons-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  grid-gap: 2rem;
  width: 100%;
  text-align: center;
  margin: 0 auto;
}

#icons-cards span img {
  width: 100%;
  opacity: 0.25;
  filter: drop-shadow(2px 4px 11px #00000096);
}

#extract,
#trim,
#convert {
  opacity: 0;
  animation-fill-mode: forwards;
  animation-duration: 1s;
  animation-iteration-count: 1;
  animation-delay: 0.5s;
  background: #22146e;
  border-radius: 2rem;
  overflow: hidden;
  padding: 1em;
  background: rgb(86,73,184);
  background: linear-gradient(51deg, rgba(86,73,184,1) -17%, rgba(34,20,110,1) 100%);
  box-shadow: inset 2px 2px 2px 2px #61359a73,
                    2px 4px 11px #00000096;
}

#icons-cards {
  background: #1f006c;
}


/*--------------------------------------------------
            PowerPlayer / Mobile UI section
 --------------------------------------------------*/

#watch-anyhwere {
  text-align: center;
  overflow: hidden;
}

@keyframes scale-down {
   0% {opacity: 0;
       transform: scale(1.5);}
 100% {opacity: 1;
       transform: scale(1);}
}

@keyframes move-right {
   0% {opacity: 0;
       transform: translateX(-55%);}
  75% {opacity: 1;}
 100% {opacity: 1;
       transform: translateX(0%);}
}

@keyframes move-left {
   0% {opacity: 0;
       transform: translateX(55%);}
  75% {opacity: 1;}
 100% {opacity: 1;
       transform: translateX(0%);}
}

@keyframes move-up {
   0% {opacity: 0;
       transform: translateY(27%);}
  50% {opacity: 1;}
 100% {opacity: 1;
       transform: translateX(0%);}
}

@keyframes back-to-front {
   0% {z-index: var(--zindexStart);
       opacity: 1;
       transform: scale(0.1);
       offset-distance: 0%;
       offset-rotate: 8deg;}
 96%  {transform: scale(1.1);}
 100% {z-index: 9;
       opacity: 1;
       transform: scale(1);
       offset-distance: 100%;
       offset-rotate: 0deg;}
}

#subgrid {
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  max-width: 550px;
}

#subgrid a,
#subgrid img {
  grid-column: 1;
  grid-row: 1;
  width: 100%;
}

#subgrid a {
  z-index: 1;
  position: relative;
  opacity: 0;
  transition-delay: 4.5s;
  transition-property: opacity;
  transition-duration: 0.5s;
  width: 15%;
  height: 18%;
  justify-self: center;
  align-self: center;
}

#pdvd-ui-bg {
  opacity: 0;
  animation-name: none;
  animation-fill-mode: forwards;
  animation-duration: 1s;
  animation-iteration-count: 1;
  animation-delay: 1.2s;
  animation-timing-function: cubic-bezier(0, 0.35, 0.67, 1.04);
}

#tablet,
#iphone {
  opacity: 0;
  animation-name: none;
  animation-fill-mode: forwards;
  animation-duration: 1.3s;
  animation-iteration-count: infinite;
  animation-iteration-count: 1;
  animation-delay: 2s;
  animation-timing-function: cubic-bezier(0.32, -0.2, 0.4, 1.16);
}

#tablet-pro,
#iphone-x {
  opacity: 0;
  animation-name: none;
  animation-fill-mode: forwards;
  animation-duration: 1.3s;
  animation-iteration-count: infinite;
  animation-iteration-count: 1;
  animation-delay: 2s;
  animation-timing-function: cubic-bezier(0.32, -0.2, 0.4, 1.16);
}

#iphone,
#iphone-x {
  animation-duration: 3s;
}

#macbook-pro {
  opacity: 0;
  animation-name: none;
  animation-fill-mode: forwards;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-iteration-count: 1;
  animation-delay: 3s;
  animation-timing-function: cubic-bezier(0.32, -0.2, 0.4, 1.16);
}

#cyberlink-cloud {
  width: 15% !important;
  align-self: start;
  justify-self: end;
  transform: translate(0%, -1%);
  opacity: 0;
  --zindexStart: 9;
  animation-name: none;
  animation-fill-mode: forwards;
  animation-duration: 1.5s;
  animation-iteration-count: 1;
  animation-delay: 3.5s;
  animation-timing-function: cubic-bezier(0.39, -0.18, 0.56, 1.41);

}

.app-badges {
   display: grid;
   grid-template-columns: 1fr 1fr;
   grid-column-gap: 1rem;
   margin: 0 auto;
   margin-top: 2rem;
   width: 100%;
   max-width: 400px;
   opacity: 0;
   transition: 2s;
   transition-delay: 5s;
}

.app-badges img {
  width: 100%;
}

   /*=====   background color   ======*/

#watch-anyhwere {
  background: #332980;
}


/*==================================================
                    iPad layout
==================================================*/

@media (min-width: 600px) {

  /*-///////////  Basic layout /////////////-*/

  #main-grid {
    grid-template-columns: 1fr 1fr;
  }

  #main-grid div,
  #main-grid img {
    background: none;
    z-index: 1;
  }

  #main-grid div.full-width:not(#icons-cards) {
    z-index: 2;
    padding: 7% 1.5rem 0;
  }

  .full-width {
    grid-column: 1 / 3;
    text-align: center;
  }

  .left-side,
  .right-side {
    align-self: center;
    place-self: center;
  }

  div.left-side,
  div.right-side {
    max-width: 400px;
  }

  .left-side {
    grid-column: 1;
  }

  .right-side {
    grid-column: 2;
  }

  img.full-width {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }


 /*--------------------------------------------------
           Home cinema at his finest section
 --------------------------------------------------*/


  #home-cinema {
    grid-row: 6;
  }

   #playback {
    grid-row: 7;
  }

   #premium-experience {
    grid-row: 7;
  }

  #bg1 {
    grid-row: 6/ 8;
    background: #000;
  }


  /*--------------------------------------------------
           Blu-ray & DVD Playback section
 --------------------------------------------------*/


  #cinema-quality, #enhanced-blu-ray {
    grid-row: 1;
  }

  #cinema-quality {
    max-height: 48vw;
  }

  #bg2 {
    grid-row: 3;
    background: #332980;
  }



  /*--------------------------------------------------
           All Formats Supported section
  --------------------------------------------------*/

  #ai-tools {
    grid-row: 2;
  }

  #all-formats {
    padding: 5%;
  }

  #all-formats, #supported-formats {
    grid-row: 3;
  }

  #bg3 {
    grid-row: 2 / 4;
    background: #1f006c;
  }


/*--------------------------------------------------
           PowerDVD Reimagined section
 --------------------------------------------------*/

   #interface, #reimagined {
    grid-row: 9;
   }

  #interface {
    max-width: 700px;
  }

  #interface img {
    --scaleEnd: 85%;
    --transZTop: 12rem;
    --transZMiddle: 8rem;
    --transZBottom: 4rem;
    transform-origin: initial;
  }

  #bg4 {
    grid-row: 9;
    background: #332980;
  }

  /*--------------------------------------------------
           Your Movies, Your Way section
  --------------------------------------------------*/

  #your-tv, #your-movies {
    grid-row: 10;
  }

  #your-tv {
    padding: 10%;
  }

   #bg5 {
    grid-row: 10;
    background: #1f006c;
  }


  /*--------------------------------------------------
                TrueTheater section
  --------------------------------------------------*/

  #tt-heading {
    grid-row: 4;
    padding-top: 6%;
  }

  #slides, #tt-desc {
    grid-row: 5;
  }

  #bg6 {
    grid-row: 4 / 6;
    background: #332980;
  }


  /*--------------------------------------------------
              Studio-Quality Audio section
  --------------------------------------------------*/

  #audio-studio, #studio-quality {
    grid-row: 8;
  }

  #audio-studio {
    transform: scale(1.5);
    margin: 10% 10% 24% 0;
    z-index: 3;
  }

  #bg7 {
    grid-row: 8;
    background: #1f006c;
  }


  /*--------------------------------------------------
                  YouTube section
  --------------------------------------------------*/

  #youtube {
    grid-row: 11;
  }

  #sub-yt-grid, #uninterrupted {
    grid-row: 12 / 13;
  }

  #bg8 {
    grid-row: 11 / 13;
    background: #000;
  }


  /*--------------------------------------------------
              Cast to any devices section
  --------------------------------------------------*/

  #streaming, #casting-devices {
    grid-row: 13;
  }

  #bg9 {
    grid-row: 13;
    background: #332980;
  }

  /*--------------------------------------------------
            Extract Trim Convert section
  --------------------------------------------------*/

  #icons-cards {
    grid-row: 14;
    max-width: 900px;
    margin: 7% auto;
  }

  #bg10 {
    grid-row: 14;
    background: #1f006c;
  }



  /*--------------------------------------------------
            PowerPlayer / Mobile UI section
  --------------------------------------------------*/

  #watch-anyhwere {
    grid-row: 15;
  }

  #bg11 {
    grid-row: 15;
    background: #332980;
  }

  #bg12 {
    padding: 5% 0;
    grid-row: 16;
    background: #332980;
  }

}


/*==================================================
                  Desktop layout
==================================================*/

@media (min-width: 1065px) {

  /*-///////////  Basic layout /////////////-*/

  #main-grid {
    grid-template-columns:
      minmax(25px, 1fr)
      minmax(min-content, 520px)
      minmax(7%, 100px)
      minmax(7%, 100px)
      minmax(min-content, 520px)
      minmax(25px, 1fr);
  }

  .full-width {
    grid-column: 1 / 7;
  }

  div.left-side,
  div.right-side {
    max-width: 520px;
  }

  .left-side {
    grid-column: 2;
  }

  .right-side {
    grid-column: 5;
  }

  /*--------------------------------------------------
           All Formats Supported section
  --------------------------------------------------*/

    #all-formats {
      grid-column: 3 / 6;
    }

  /*--------------------------------------------------
           PowerDVD Reimagined section
  --------------------------------------------------*/

  #interface {
    grid-column: 1 / 5;
    max-width: none;
    margin-left: 10%;
  }

  #interface img {
    --scaleEnd: 100%;
    --transZTop: 19rem;
    --transZMiddle: 12rem;
    --transZBottom: 6rem;
  }

  /*--------------------------------------------------
           Your Movies, Your Way section
  --------------------------------------------------*/

  #your-tv {
    grid-column: 3 / 6;
  }

  /*--------------------------------------------------
              Studio-Quality Audio section
  --------------------------------------------------*/

  #main-grid #audio-studio {
    grid-column: 4 / 6;
  }

  /*--------------------------------------------------
              Cast to any devices section
  --------------------------------------------------*/

  #streaming {
    grid-column: 3 / 6;
  }

  /*--------------------------------------------------
            Extract Trim Convert section
  --------------------------------------------------*/

  #icons-cards {
    max-width: 1000px;
  }

  #bg10 {
    grid-row: 14;
    background: #1f006c;
  }


  /*--------------------------------------------------
            PowerPlayer / Mobile UI section
  --------------------------------------------------*/

  #cyberlink-cloud {
     --zindexStart: -9;
     offset-path: path("M45,24c0,0,84.06-1.49,94.76-17.12S71.11,24.4,45.16,47.02z");
  }


}


  /*==================================================
                  larger Desktop layout
  ==================================================*/

  /*--------------------------------------------------
            PowerPlayer / Mobile UI section
  --------------------------------------------------*/

  @media (min-width: 1285px) {

    #subgrid {
    max-width: 880px;
  }

   #cyberlink-cloud {
    offset-path: path("M62.16,44.02c0,0,84.06-1.49,94.76-17.12S71.11,24.4,45.16,47.02z");
  }

}