/* main.css overrides  */

.img-wrap-features .full-split>.text-col {
  padding: 200px 7vw 200px 7vw;
}
.img-wrap-features.br-blue-mountains p {
  font-size: 24px;
  line-height: 32px;
}

/* end main.css overrides */

.img-wrap-features .image-reveal {
  width: 100%;
  height: 100%;
}

.img-wrap-features .img-full {
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  background-size: cover;
  margin: 0 auto;
}

.page-node-1554 .img-wrap-features .sunset-gradient .image-reveal .img-full {
  background-size: 98% auto;
}

.img-wrap-features.br-blue-mountains .col.order-first .image-with-wrapped-text-backgroundimage {
  background-position: right;
}
.img-wrap-features.br-blue-mountains .col.order-last .image-with-wrapped-text-backgroundimage {
  background-position: left;
}

/* from /tv/tivo */

.img-wrap-features .tivo-remote-animation {
  position: relative;
  overflow: hidden;
}

.img-wrap-features .sunset-gradient,
.img-wrap-features .animated .sunset-gradient .image-reveal:after {
  background: rgb(255, 166, 77);
  background: -webkit-gradient(linear, left top, left bottom, from((255, 166, 77, 1)), color-stop(99%, rgba(255, 225, 77, 1)));
  background: linear-gradient(180deg, rgba(255, 166, 77, 1) 0%, rgba(255, 225, 77, 1) 99%);
}

.img-wrap-features .aquarium-gradient,
.img-wrap-features .animated .aquarium-gradient .image-reveal:after {
  background: rgb(102, 217, 255);
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(102, 217, 255, 1)), color-stop(99%, rgba(115, 230, 203, 1)));
  background: linear-gradient(180deg, rgba(102, 217, 255, 1) 0%, rgba(115, 230, 203, 1) 99%);
}

.img-wrap-features .gray-gradient,
.img-wrap-features .animated .gray-gradient .image-reveal:after {
  background: rgb(245, 245, 245);
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(245, 245, 245, 1)), color-stop(99%, rgba(245, 245, 245, 1)));
  background: linear-gradient(180deg, rgba(245, 245, 245, 1) 0%, rgba(245, 245, 245, 1) 99%);
}

.img-wrap-features .tivo-remote-gradient,
.img-wrap-features .animated .tivo-remote-gradient .image-reveal:after {
  background: rgb(2, 21, 98);
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(2, 21, 98, 1)), color-stop(99%, rgba(1, 167, 225, 1)));
  background: linear-gradient(0deg, rgba(2, 21, 98, 1) 0%, rgba(1, 167, 225, 1) 99%);
}

.img-wrap-features.theme-mobile-color .col.text-col {
  background: linear-gradient(118deg, #000098 0%, #2411e6 30%, #7e00d5 64%, #ff3433 100%) 0% 0% no-repeat padding-box;
}

.img-wrap-features p {
  font-size: 24px;
  line-height: 32px;
  padding-top: 10px;
}

/* from /tv/tivo-remote */

.img-wrap-features .commands {
  width: 100%;
  position: absolute;
  top: 0;
}

.img-wrap-features .command {
  position: absolute;
  top: 220px;
  right: calc(50% - 260px);
  font-weight: 600;
  background: #ffffff;
  font-size: 18px;
  color: #01a7e1;
  line-height: 22px;
  padding: 20px 30px;
  border-radius: 10px;
  -webkit-box-shadow: 0 0 54px 0 rgba(0, 0, 0, .19);
  box-shadow: 0 0 54px 0 rgba(0, 0, 0, .19);
  width: 260px;
  text-align: center;
}

.img-wrap-features .commands .command-left {
  left: calc(50% - 260px);
}

.img-wrap-features .command:after {
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  border-left: 10px solid #fff;
  border-right: 10px solid transparent;
  border-top: 10px solid #fff;
  border-bottom: 10px solid transparent;
  left: 19px;
  bottom: -19px;
}

.img-wrap-features .commands .command {
  opacity: 0;
  -webkit-transition: all .5s cubic-bezier(.215, .61, .355, 1);
  transition: all .5s cubic-bezier(.215, .61, .355, 1);
  -webkit-transform: translateY(50px);
  transform: translateY(50px);
}

.img-wrap-features .commands1 .command1,
.img-wrap-features .commands2 .command2,
.img-wrap-features .commands3 .command3,
.img-wrap-features .commands4 .command4,
.img-wrap-features .commands5 .command5,
.img-wrap-features .commands6 .command6 {
  opacity: 1;
  -webkit-transition: all .5s cubic-bezier(.215, .61, .355, 1) .2s;
  transition: all .5s cubic-bezier(.215, .61, .355, 1) .2s;
  -webkit-transform: translateY(0px);
  transform: translateY(0px);
}

.img-wrap-features .commands .command-left:after {
  border-left: 10px solid transparent;
  border-right: 10px solid #fff;
  border-top: 10px solid #fff;
  border-bottom: 10px solid transparent;
  right: 19px;
  left: auto;
}

.img-wrap-features .vox-remote:before,
.img-wrap-features .vox-remote:after,
.img-wrap-features .remote-ring {
  content: "";
  display: block;
  border-radius: 100%;
  width: 60px;
  height: 60px;
  position: absolute;
  /*border: solid 1px #fff;*/
  background: #fff;
  top: 302px;
  left: 54%;
  z-index: -1;
  opacity: 0;
  -webkit-transform: translateZ(-1px) scale(1);
  transform: translateZ(-1px) scale(1);
}

.img-wrap-features .start-speach.vox-remote:before,
.img-wrap-features .start-speach.vox-remote:after,
.img-wrap-features .start-speach .remote-ring {
  -webkit-animation: remote-ring 2s cubic-bezier(0.215, 0.610, 0.355, 1.000) infinite;
  -webkit-animation: remote-ring 2s cubic-bezier(0.215, 0.610, 0.355, 1.000) infinite;
  animation: remote-ring 2s cubic-bezier(0.215, 0.610, 0.355, 1.000) infinite;
  animation: remote-ring 2s cubic-bezier(0.215, 0.610, 0.355, 1.000) infinite;
}

.img-wrap-features .start-speach.vox-remote:after {
  -webkit-animation-delay: .8s;
  animation-delay: .8s;
}

.img-wrap-features .start-speach.vox-remote .remote-ring {
  -webkit-animation-delay: 1.4s;
  animation-delay: 1.4s;
}

/* HomeFi Dark */
.img-wrap-features.homefi-dark .text-col {
  background: rgb(10, 20, 150);
  background: linear-gradient(145deg, rgba(10, 20, 150, 1) 0%, rgba(9, 23, 155, 1) 25%, rgba(1, 46, 184, 1) 50%, rgba(0, 96, 220, 1) 80%, rgba(0, 136, 237, 1) 90%, rgba(0, 165, 248, 1) 100%);
}
.img-wrap-features.homefi-dark .full-split>.text-col {
  padding: 80px 8vw 80px 5vw;
}

@-webkit-keyframes remote-ring {
  0% {
    opacity: 1;
    -webkit-transform: translateZ(-1px) scale(1);
    transform: translateZ(-1px) scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateZ(-1px) scale(10);
    transform: translateZ(-1px) scale(10);
  }
}

@keyframes remote-ring {
  0% {
    opacity: 1;
    -webkit-transform: translateZ(-1px) scale(1);
    transform: translateZ(-1px) scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateZ(-1px) scale(10);
    transform: translateZ(-1px) scale(10);
  }
}

.img-wrap-features h3 {
  font-size: 31px;
  line-height: 47px;
  font-weight: bold;
}

.img-wrap-features .tivo-feat:first-child:not(:only-child) {
  padding-bottom: 60px;
  margin-bottom: 60px;
  border-style: solid;
  border-bottom-width: 1px;
}

.img-wrap-features .vox-remote {
  background-repeat: no-repeat;
  width: 361px;
  height: 1006px;
  background-size: contain;
  margin: 0 auto;
  -webkit-transform: translateX(-45px);
  transform: translateX(-45px);
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.img-wrap-features .video-link,
.img-wrap-features .video-link:hover,
.img-wrap-features .video-link:hover:before,
.img-wrap-features .video-link:before {
  -webkit-transition: all .3s cubic-bezier(.215, .61, .355, 1);
  transition: all .3s cubic-bezier(.215, .61, .355, 1);
}

.img-wrap-features .video-link {
  position: relative;
  padding-left: 55px;
  display: inline-block;
  padding: 8px 10px 10px 50px;
  -webkit-transform: translateX(0px);
  transform: translateX(0px);
}

.img-wrap-features.theme-dark .video-link {
  color: white;
}

.img-wrap-features .video-link:hover {
  -webkit-transform: translateX(7px);
  transform: translateX(7px);
}

.img-wrap-features .video-link svg {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  margin-right: 10px;
  height: 41px;
  width: 41px;
}

.img-wrap-features .video-link:hover svg {
  -webkit-transform: scale(1.2) translateX(-7px);
  transform: scale(1.2) translateX(-7px);
}

.img-wrap-features.theme-dark .video-link svg path {
  stroke: #ffffff;
  fill: #ffffff;
}

.img-wrap-features.theme-dark .video-link svg ellipse {
  stroke: #ffffff;
}

.img-wrap-features .border-white {
  border-color: rgba(255, 255, 255, .33);
}

.img-wrap-features .border-aqua {
  border-color: rgba(60, 255, 255, .33);
}

.img-wrap-features .border-symmetry-blue {
  border-color: rgba(0, 0, 155, .33);
}

.img-wrap-features .stream-border,
.img-wrap-features .symmetry-border {
  border-width: 15px;
}

.img-wrap-features .symmetry-border {
  border-image: linear-gradient(310deg, #ff8c24 0%, #ff3333 29%, #7100c1 44%, #0516ed 57%, #030dcb 82%, #00009b 100%) 1;
}

.img-wrap-features.symmetry-hero:after {
  background-position-x: right;
  background-position-y: top;
}

@media only screen and (max-width: 1000px) {
  .img-wrap-features .imageCol {
    padding: 0 0 40px 0;
  }

  .img-wrap-features.br-blue-mountains .col.order-first .image-with-wrapped-text-backgroundimage,
  .img-wrap-features.br-blue-mountains .col.order-last .image-with-wrapped-text-backgroundimage {
    background-position: center;
    background-size: 90%;
  }
  .img-wrap-features .command:after,
  .img-wrap-features .command.command-left:after {
    content: none;
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(255, 255, 255, 0);
    border-top-color: #ffffff;
    border-width: 10px;
    margin-left: -10px;
  }
  .img-wrap-features .command,
  .img-wrap-features .commands .command-left {
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 350px;
    top: 190px;
    max-width: 90%;
  }
}

@media only screen and (max-width: 1024px) {
  .img-wrap-features .full-split>.text-col {
    padding: 40px 7vw 140px 7vw;
  }
}

@media only screen and (max-width: 720px) {

  .img-wrap-features .full-split>.text-col {
    padding: 40px 7vw 40px 7vw;
  }

  .img-wrap-features .paragraph--type--image-with-wrapped-feature-item h2,
  .img-wrap-features .paragraph--type--image-with-wrapped-feature-item h3 {
    text-align: center;
  }

  .img-wrap-features .paragraph--type--image-with-wrapped-feature-item p {
    text-align: center;
    font-size: 20px;
    line-height: 28px;
  }
  .img-wrap-features.br-blue-mountains p {
    font-size: 20px;
    line-height: 28px;
  }
  .img-wrap-features .stick {
    position: inherit;
    top: 0;
    -webkit-transform: none;
    transform: none;
  }
  .img-wrap-features .img-full.showImage {
    height: 500px !important;
  }
}

@media only screen and (max-width: 414px) {
  .img-wrap-features .full-split>.col:last-child {
    padding: 40px 20px;
  }
  .img-wrap-features .tivo-feat:first-child:not(:only-child) {
    padding-bottom: 40px;
    margin-bottom: 40px;
  }
  .img-wrap-features .img-full.showImage {
    height: 300px !important;
  }
}

/* Info Icon overrides for theme colors */
.info-icon:after {
  content: "";
  -webkit-mask: url(/themes/custom/blue_ridge_base/images/info-icon-white.svg) center / contain no-repeat;
  mask: url(/themes/custom/blue_ridge_base/images/info-icon-white.svg) center / contain no-repeat;
  background-color: #FFFFFF;
  background-position: center;
  background-repeat: no-repeat;
  display: inline-block;
  margin-bottom: -1px;
  width: 16px;
  aspect-ratio: 1/1;
}

.info-icon:hover:after {
  cursor: pointer;
}

.color-gray .info-icon:after {
  background-color: #002f8c;
}
.color-symmetry-gray .info-icon:after {
  background-color: #00009b;
}
.color-mobile-gray .info-icon:after {
  background-color: #000098;
}

.tippy-box[data-theme~="info-disclaimer"] {
  background: #FFFFFF;
  color: #1E1E1E;
  min-width: 472px;
  padding: 0;
  border-radius: 8px;
  box-shadow: 0 33px 57px 0 rgba(0, 0, 0, .06);
  border: 1px solid #F5F5F6;
}

.tippy-box[data-theme~="info-disclaimer"] .tippy-arrow {
  color: #fff;
}

.tippy-box[data-theme~="info-disclaimer"] .tippy-content {
  font-family: 'Avenir Next LT Pro';
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 20px;
  color: #000000;
}

@media (max-width: 1025px) {
  .tippy-box[data-theme~="info-disclaimer"] {
    min-width: 0;
    width: calc(100vw - 100px);
    max-width: calc(100vw - 100px) !important;
  }
}

@media (max-width: 767px) {
  .tippy-box[data-theme~="info-disclaimer"] {
    min-width: 0;
    width: calc(100vw - 32px);
    max-width: calc(100vw - 32px) !important;
  }
}
