/* 1. 设置盒模型 */
*,
*::before,
*::after {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
}

/* 2. 基础样式 */
html {
   scroll-behavior: smooth;
   /* 平滑滚动 */
   font-size: 16px;
   /* 默认字体大小 */
   line-height: 1.6;
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
      Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

body {
   background-color: #fff;
   color: #333;
   min-height: 100vh;
   position: relative;
}

/* 3. 链接和按钮默认样式 */
a {
   text-decoration: none;
   color: inherit;
}

button {
   cursor: pointer;
   background: none;
   border: none;
   padding: 0;
   font: inherit;
}

/* 4. 图片和媒体 */
img {
   max-width: 100%;
   height: auto;
   display: block;
}

/* 5. 列表默认样式 */
ul,
ol {
   list-style: none;
}

/* 6. 表单元素 */
input,
textarea,
select {
   font: inherit;
   padding: 0.5em;
   border: 1px solid #ccc;
   border-radius: 4px;
   width: 100%;
}

/* 7. 响应式图片和对象 */
img,
video,
canvas,
iframe,
svg {
   max-width: 100%;
   height: auto;
}

/* 8. 文本省略 */
.ellipsis {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

/* 9. 清除浮动 */
.clearfix::after {
   content: "";
   display: table;
   clear: both;
}

/* 10. 响应式文字大小（可选） */
html {
   font-size: 16px;
}

@media (max-width: 768px) {
   html {
      font-size: 15px;
   }
}

@media (max-width: 480px) {
   html {
      font-size: 14px;
   }
}

header {
   width: 100%;
   height: 96px;
   background-color: #fff;
   position: relative;
   box-shadow: 0 0px 20px rgba(0, 0, 0, 0.04);
}

.nav_box {
   width: 1440px;
   height: 100%;
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin: 0 auto;
   padding-left: 80px;
}

/* 媒体查询中使用相同的选择器 */
@media screen and (max-width: 1368px) {
   .nav_box {
      width: 100%;
      height: 100%;
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin: 0 auto;
      padding-left: 30px;
      padding-right: 30px;
   }
}

/* 媒体查询中使用相同的选择器 */
@media screen and (max-width: 1440px) {
   .nav_box {
      width: 100%;
      height: 100%;
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin: 0 auto;
      padding-left: 30px;
      padding-right: 30px;
   }
}

.core_url {
   width: 140px;
   position: absolute;
   top: 50%;
   left: 30px;
   z-index: 1000;
   transform: translateY(-50%);
}

.core_url img {
   width: 100%;
}

.logo {
   width: 116px;
   height: 48px;
}

.logo img {
   width: 100%;
}

.menu {
   display: flex;
   justify-content: space-between;
   align-items: center;
}

.menu .home {
   color: #fbb932;
   font-size: 18px;
   margin-right: 30px;
}

.menu .menu_dow {
   display: flex;
   justify-content: space-between;
   align-items: center;
}

.menu .menu_dow a {
   border: 1px solid #fbb932;
   border-radius: 4px;
   color: #fbb932;
   font-size: 16px;
   height: 40px;
   padding: 0 12px;
   margin: 0 10px;
   display: flex;
   align-items: center;
}

.menu .menu_dow a:hover {
   color: #fff;
   background-color: #fbb932;
}

.menu .menu_dow a:hover .left_icon {
   background-image: url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDExNjMgMTAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiPjxwYXRoIGQ9Ik0xMDc2LjUxNyAwSDg3LjI4NUE4Ny4yODUgODcuMjg1IDAgMCAwIDAgODcuMjg1djY1Ni40NTdhODcuMjg1IDg3LjI4NSAwIDAgMCA4Ny4yODUgODcuMjg1aDMwNy4xNzF2MTI4LjIzN0gxNzcuNDA3YTMyLjM2OCAzMi4zNjggMCAwIDAgMCA2NC43MzZoODA4Ljk4OGEzMi4zNjggMzIuMzY4IDAgMSAwIDAtNjQuNzM2SDc2OS41NjRWODMxLjAyN2gzMDYuOTUzYTg3LjI4NSA4Ny4yODUgMCAwIDAgODcuMjg1LTg3LjI4NVY4Ny4yODVBODcuMjg1IDg3LjI4NSAwIDAgMCAxMDc2LjUxNyAwem01Mi44OCA3MzEuODEzSDQyLjY5N1Y2Ny41aDEwODYuN3oiIGZpbGw9IiNmZmYiLz48L3N2Zz4=);
}

.menu_dow_btn {
   background-position: 50%;
   background-repeat: no-repeat;
   background-size: contain;
   display: inline-block;
   vertical-align: middle;
   margin-right: 6px;
}

.left_icon {
   background-image: url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDExNjMgMTAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiPjxwYXRoIGQ9Ik0xMDc2LjUxNyAwSDg3LjI4NUE4Ny4yODUgODcuMjg1IDAgMCAwIDAgODcuMjg1djY1Ni40NTdhODcuMjg1IDg3LjI4NSAwIDAgMCA4Ny4yODUgODcuMjg1aDMwNy4xNzF2MTI4LjIzN0gxNzcuNDA3YTMyLjM2OCAzMi4zNjggMCAwIDAgMCA2NC43MzZoODA4Ljk4OGEzMi4zNjggMzIuMzY4IDAgMSAwIDAtNjQuNzM2SDc2OS41NjRWODMxLjAyN2gzMDYuOTUzYTg3LjI4NSA4Ny4yODUgMCAwIDAgODcuMjg1LTg3LjI4NVY4Ny4yODVBODcuMjg1IDg3LjI4NSAwIDAgMCAxMDc2LjUxNyAwem01Mi44OCA3MzEuODEzSDQyLjY5N1Y2Ny41aDEwODYuN3oiIGZpbGw9IiNGRUJDMDAiLz48L3N2Zz4=);
   height: 18px;
   width: 18px;
   margin-top: 2px;
}

.right_icon {
   background-image: url(../images/microsoft.svg);
   height: 25px;
   width: 25px;
   margin-top: 2px;
}

.menu .mt {
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-left: 10px;
}

.menu .mt .mt_icon {
   background-color: #febc00;
   background-position: 50%;
   background-repeat: no-repeat;
   border-radius: 50%;
   box-sizing: border-box;
   display: inline-block;
   height: 30px;
   margin: 0 8px;
   position: relative;
   text-align: center;
   width: 30px;
   cursor: pointer;
}

.icon_1 {
   background-image: url(../images/bilibili.svg);
   background-position: center;
   background-size: cover;
}

.icon_1:hover {
   background-color: #fff !important;
   box-shadow: 0 0 0 1px #febc00;
   background-image: url(../images/bilibili1.svg);
}

.icon_2 {
   background-image: url(../images/QQ.svg);
   background-position: center;
   background-size: 24px 24px;
}

.icon_2:hover {
   background-color: #fff !important;
   box-shadow: 0 0 0 1px #febc00;
   background-image: url(../images/QQ1.svg);
}

.icon_3 {
   background-image: url(../images/weibo.svg);
   background-position: center;
   background-size: 24px 24px;
}

.icon_3:hover {
   background-color: #fff !important;
   box-shadow: 0 0 0 1px #febc00;
   background-image: url(../images/weibo1.svg);
}

.icon_4 {
   background-image: url(../images/tieba.svg);
   background-position: center;
   background-size: 22px 22px;
}

.icon_4:hover {
   background-color: #fff !important;
   box-shadow: 0 0 0 1px #febc00;
   background-image: url(../images/tieba1.svg);
}

section {
   overflow: hidden;
   background: linear-gradient(180deg, #fafafa, #dcdfe4 450px, #dcdfe4 696px, #fff 982px) no-repeat;
}

.main_h2 {
   display: flex;
   justify-content: center;
   align-items: center;
   color: #333;
   font-size: 2.25rem;
   font-weight: 400;
   line-height: 3.125rem;
   text-align: center;
   margin: 30px auto 0;
   background: none;
}

.main_h2 img {
   height: 5.8475rem;
   width: 21.5625rem;
}

.platform_tabs {
   border-bottom: 1px solid #dcdcdc;
   margin: 10px auto 30px;
   max-width: 1080px;
   padding-top: 6px;
   text-align: center;
}

.platform-tab {
   background: none;
   border: none;
   color: #333;
   cursor: pointer;
   display: inline-block;
   font-size: 18px;
   font-weight: 700;
   margin-left: 40px;
   margin-right: 40px;
   outline: none;
   padding: 18px 2px 15px;
}

.platform_tabs .active {
   border-bottom: 2px solid #f4bb0b;
   color: #f4bb0b;
}

.main_box {
   width: 1920px;
   height: 31.875rem;
   position: relative;
   overflow-y: hidden;
   overflow-x: hidden;
   left: 50%;
   transform: translateX(-50%);
   overflow: hidden;
}

.swiper-slide {
   height: 100%;
   text-align: center;
   font-size: 18px;
   position: relative;
   z-index: 1;
   display: flex;
   justify-content: center;
   align-items: center;
   transition: transform 0.3s ease;
}

.swiper-slide p {
   position: absolute;
   bottom: 10px;
   left: 50%;
   transform: translateX(-50%);
   padding: 10px 60px;
   border-radius: 20px;
   background: rgba(0, 0, 0, 0.4);
   color: #fff;
   font-size: 14px;
}

.screens {
   background: url(../picture/bannerbg.avif) no-repeat 50%;
   background-size: cover;
   height: 31.875rem;
   left: 0;
   position: absolute;
   top: 0;
   width: 100%;
   z-index: 10;
}

.swiper-container {
   overflow: hidden;
   height: 90%;
}

.main_swiper {
   width: 42.5%;
   position: absolute;
   top: 47.6%;
   left: 50.1%;
   transform: translate(-50%, -50%);
   z-index: 12 !important;
   border-radius: 6px;
}

.left_swiper {
   width: 42.5%;
   position: absolute;
   top: 2.8%;
   left: -12%;
   z-index: 9 !important;
}

.swiper-slide img {
   height: 100%;
   width: 100%;
}

.right_swiper {
   width: 42.5%;
   position: absolute;
   top: 2.8%;
   right: -12%;
   z-index: 9 !important;
}

.swiper-slide video {
   height: 100%;
   width: 100%;
}

.swiper-button-prev {
   background-image: url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiPjxwYXRoIGQ9Im0zODQgNTEyIDM0Ny43MzMtMzA5LjMzM0M3NDguOCAxODcuNzMzIDc1MC45MzMgMTYwIDczNiAxNDIuOTMzYy0xNC45MzMtMTcuMDY2LTQyLjY2Ny0xOS4yLTU5LjczMy00LjI2NkwyOTIuMjY3IDQ4MGMtMTAuNjY3IDguNTMzLTE0LjkzNCAxOS4yLTE0LjkzNCAzMnM0LjI2NyAyMy40NjcgMTQuOTM0IDMybDM4NCAzNDEuMzMzQzY4NC44IDg5MS43MzMgNjk1LjQ2NyA4OTYgNzA0IDg5NmMxMi44IDAgMjMuNDY3LTQuMjY3IDMyLTE0LjkzMyAxNC45MzMtMTcuMDY3IDE0LjkzMy00NC44LTQuMjY3LTU5LjczNEwzODQgNTEyeiIvPjwvc3ZnPg==);
   background-color: #fff;
   background-position: 50%;
   background-repeat: no-repeat;
   background-size: 28px 28px;
   border-radius: 50%;
   height: 56px;
   margin-top: -28px;
   opacity: .7;
   width: 56px;
   position: absolute;
   left: 22%;
}

.swiper-button-prev:hover {
   opacity: 1;
}

.swiper-button-prev::after {
   display: none;
}

.swiper-button-next {
   background-image: url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiPjxwYXRoIGQ9Im03MzEuNzMzIDQ4MC0zODQtMzQxLjMzM2MtMTcuMDY2LTE0LjkzNC00NC44LTE0LjkzNC01OS43MzMgNC4yNjYtMTQuOTMzIDE3LjA2Ny0xNC45MzMgNDQuOCA0LjI2NyA1OS43MzRMNjQwIDUxMiAyOTIuMjY3IDgyMS4zMzNDMjc1LjIgODM2LjI2NyAyNzMuMDY3IDg2NCAyODggODgxLjA2NyAyOTYuNTMzIDg4OS42IDMwNy4yIDg5NiAzMjAgODk2YzEwLjY2NyAwIDE5LjItNC4yNjcgMjcuNzMzLTEwLjY2N2wzODQtMzQxLjMzM2M4LjUzNC04LjUzMyAxNC45MzQtMTkuMiAxNC45MzQtMzJzLTQuMjY3LTIzLjQ2Ny0xNC45MzQtMzJ6Ii8+PC9zdmc+);
   background-color: #fff;
   background-position: 50%;
   background-repeat: no-repeat;
   background-size: 28px 28px;
   border-radius: 50%;
   height: 56px;
   margin-top: -28px;
   opacity: .7;
   width: 56px;
   z-index: 10;
   position: absolute;
   right: 22%;
}

.swiper-button-next:hover {
   opacity: 1;
}

.swiper-button-next::after {
   display: none;
}

/* 音乐播放按钮 */
#sound-toggle-btn {
   position: absolute;
   bottom: 20px;
   /* 距离底部的位置 */
   right: 20px;
   /* 距离右侧的位置 */
   width: 40px;
   height: 40px;
   cursor: pointer;
   z-index: 10000;
   /* 确保在视频上层 */
   background-size: contain;
   transition: opacity 0.3s;
   opacity: 0.7;
}

#sound-toggle-btn:hover {
   opacity: 1;
}

/* 声音图标 */
#sound-toggle-btn.sound-off {
   background-image: url('../images/yybtn.png');
   /* 请替换为你的图标 */
}

/* 定义旋转动画 */
@keyframes spin {
   from {
      transform: rotate(0deg);
   }

   to {
      transform: rotate(360deg);
   }
}

/* 默认隐藏动画（或你可以在静止状态下用 .sound-off） */
#sound-toggle-btn {
   /* 初始状态下你可设置一个静态图标或颜色 */
}

/* 当按钮带 .rotating 类时，启动无限匀速旋转 */
#sound-toggle-btn.rotating {
   animation: spin 4s linear infinite;
   /* 注意：不能在这里写 paused */
}

/* 当按钮带 .paused 类时，强制暂停动画 */
#sound-toggle-btn.paused {
   animation-play-state: paused;
}

/* 视频弹出层样式 */
.video-modal {
   position: fixed;
   top: 0;
   left: 0;
   z-index: 10000;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.8);
   display: none;
   justify-content: center;
   align-items: center;
   opacity: 0;
   pointer-events: none;
   transition: opacity 0.3s ease;
}

.video-modal.active {
   display: flex;
   opacity: 1;
   pointer-events: auto;
}

.modal-content {
   width: 65%;
   transform: scale(0.1);
   opacity: 0;
   transform-origin: center;
   transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.3s ease;
}

.modal-btn {
   position: absolute;
   bottom: 50px;
   left: 50%;
   transform: translateX(-50%);
   padding: 14px 60px;
   background-color: #f1ac1f;
   border-radius: .5rem;
   color: #fff;
   display: inline-block;
   font-size: 18px;
   cursor: pointer;
   z-index: 1000;
}

.modal-btn:hover {
   background-color: #f6b637;
}

.video-modal.active .modal-content {
   transform: scale(1);
   opacity: 1;
}

.modal-video {
   width: 100%;
   border-radius: 10px;
}

.close-modal {
   background: url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iNjQiIGhlaWdodD0iNjQiPjxwYXRoIGQ9Im01NjYuNCA1MTIgMzE4LjQtMzE4LjRjMTYtMTYgMTYtMzguNCAwLTU0LjRzLTM4LjQtMTYtNTQuNCAwTDUxMiA0NTcuNiAxOTIgMTQwLjhjLTE0LjQtMTYtMzguNC0xNi01Mi44IDBzLTE2IDM4LjQgMCA1NC40TDQ1Ny42IDUxMiAxMzkuMiA4MzAuNGMtMTYgMTYtMTYgMzguNCAwIDU0LjQgOCA2LjQgMTYgMTEuMiAyNy4yIDExLjJzMTkuMi0zLjIgMjcuMi0xMS4ybDMyMC0zMTguNCAzMjAgMzE2LjhjOCA2LjQgMTkuMiAxMS4yIDI3LjIgMTEuMnMxOS4yLTMuMiAyNy4yLTExLjJjMTYtMTYgMTYtMzguNCAwLTU0LjRMNTY2LjQgNTEyeiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg==) no-repeat 50%;
   background-color: rgba(0, 0, 0, .6);
   background-size: 24px 24px;
   border-radius: 50%;
   cursor: pointer;
   height: 48px;
   position: absolute;
   right: 20px;
   top: 20px;
   width: 48px;
   z-index: 110;
}

.system-download {
   text-align: center;
}

.download-btn {
   background: linear-gradient(135deg, #f4c000, #f4a600);
   border-radius: .5rem;
   color: #fff8e9;
   display: inline-block;
   font-size: 1.4375rem;
   font-weight: 400;
   padding: 20px 80px;
   margin: .9375rem auto;
}

.download-btn img {
   float: left;
   margin-top: 3px;
   margin-right: 20px;
}

.system-desc {
   font-weight: 400;
   text-align: center;
   width: 100%;
   font-size: .875rem;
}

.wallpaper-categories {
   padding: 10px 0 50px;
   text-align: center;
}

.categories {
   padding: 1.25rem 0;
   text-align: center;
   width: 100%;
}

.category {
   color: #696d72;
   cursor: pointer;
   display: inline-block;
   font-size: 1.3rem;
   line-height: 1.875rem;
}

.category:not(:last-child):after {
   background: #b8b8b8;
   content: "";
   display: inline-block;
   height: .875rem;
   vertical-align: middle;
   width: .0625rem;
}

.category.active span {
   border-bottom: .1875rem solid #f4c000;
   color: #343434;
}

.category span {
   color: #343434;
   display: inline-block;
   margin: 0 .625rem;
   padding: 0 .625rem;
}

.wallpaper-gallery {
   height: 45rem;
   margin: 0 auto;
   width: 75rem;
}

.clearfix:after,
.clearfix:before {
   clear: both;
   content: "";
   display: block;
   height: 0;
   visibility: hidden;
}

.wallpaper-item {
   border-radius: .5rem;
   box-sizing: border-box;
   cursor: pointer;
   float: left;
   height: 13.75rem;
   margin: .4375rem;
   overflow: hidden;
   position: relative;
   width: 23.75rem;
   z-index: 100;
}

.wallpaper-item img {
   box-sizing: border-box;
   height: 100%;
   width: 100%;
}

.mask {
   background: rgba(30, 30, 30, .5);
   display: none;
   height: 100%;
   top: 0;
   left: 0;
   position: absolute;
   width: 100%;
}

.btn {
   background: #fbb932;
   border-radius: .5rem;
   color: #333;
   display: block;
   font-size: 1.125rem;
   font-weight: 700;
   height: 3.5rem;
   left: 6.125rem;
   line-height: 3.5rem;
   position: absolute;
   text-align: center;
   top: 5.125rem;
   width: 11.5rem;
   z-index: 102;
}

.wallpaper-item:hover .mask {
   display: block;
}

.text_tcc {
   position: fixed;
   top: 50%;
   left: 50%;
   z-index: 10000;
   transform: translate(-50%, -50%);
   padding: 50px 100px;
   background: #fff;
   box-shadow: 0 10px 24px rgba(0, 0, 0, .2);
   border-radius: 6px;
   display: none;
}

.text_tishi {
   font-size: 20px;
   color: #333;
   font-weight: 600;
}

.close_btn {
   background: url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iNjQiIGhlaWdodD0iNjQiPjxwYXRoIGQ9Im01NjYuNCA1MTIgMzE4LjQtMzE4LjRjMTYtMTYgMTYtMzguNCAwLTU0LjRzLTM4LjQtMTYtNTQuNCAwTDUxMiA0NTcuNiAxOTIgMTQwLjhjLTE0LjQtMTYtMzguNC0xNi01Mi44IDBzLTE2IDM4LjQgMCA1NC40TDQ1Ny42IDUxMiAxMzkuMiA4MzAuNGMtMTYgMTYtMTYgMzguNCAwIDU0LjQgOCA2LjQgMTYgMTEuMiAyNy4yIDExLjJzMTkuMi0zLjIgMjcuMi0xMS4ybDMyMC0zMTguNCAzMjAgMzE2LjhjOCA2LjQgMTkuMiAxMS4yIDI3LjIgMTEuMnMxOS4yLTMuMiAyNy4yLTExLjJjMTYtMTYgMTYtMzguNCAwLTU0LjRMNTY2LjQgNTEyeiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg==) no-repeat 50%;
   background-color: rgba(0, 0, 0, .6);
   background-size: 24px 24px;
   border-radius: 50%;
   cursor: pointer;
   height: 30px;
   position: absolute;
   right: 20px;
   top: 20px;
   width: 30px;
   z-index: 110;
}

.engine-intro {
   padding: 63px 0;
   text-align: center;
}

.intro-section:nth-child(odd) {
   background: rgba(248, 188, 19, .1);
}

.title {
   color: #333;
   font-size: 2.25rem;
   font-weight: 700;
   line-height: 3.125rem;
   text-align: center;
}

.desc {
   font-size: 20px;
   font-size: 1.25rem;
   line-height: 30px;
   margin-top: 6px;
}

.video-list {
   margin-top: 55px;
}

.video-item {
   border-radius: 8px;
   cursor: pointer;
   display: inline-block;
   height: 213px;
   margin: 10px;
   overflow: hidden;
   position: relative;
   width: 380px;
}

.video {
   height: 100%;
   width: 100%;
}

.masks {
   background: rgba(30, 30, 30, .5);
   bottom: 0;
   left: 0;
   position: absolute;
   right: 0;
   top: 0;
}

.video-title {
   color: #fff;
   font-size: 18px;
   margin-bottom: 24px;
   margin-top: 56px;
}

.play-icon {
   background: url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiPjxwYXRoIGQ9Ik01MTIgMEMyMjkuMjQ4IDAgMCAyMjkuMjQ4IDAgNTEyczIyOS4yNDggNTEyIDUxMiA1MTIgNTEyLTIyOS4yNDggNTEyLTUxMlM3OTQuNzUyIDAgNTEyIDB6bTE5OS45NzkgNTI1LjY1M0w0MjAuNTIzIDc3My42MzJhMjEuNTQ3IDIxLjU0NyAwIDAgMS0xNC4zMzYgNS4zNzZjLTEwLjc5NSAwLTIxLjAzNS03LjU5NS0yMS4wMzUtMTkuMDNWMjYzLjkzN2MwLTExLjQzNSAxMC4yNC0xOS4wNzIgMjEuMDM1LTE5LjA3MiA1LjAzNCAwIDEwLjExMiAxLjYyMSAxNC4zMzYgNS40MTlMNzExLjk3OSA0OTguMjZjOC41MzMgNy41MSA4LjUzMyAxOS44NCAwIDI3LjM1eiIgZGF0YS1zcG0tYW5jaG9yLWlkPSJhMzEzeC43NzgxMDY5LjAuaTciIGNsYXNzPSJzZWxlY3RlZCIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg==) no-repeat;
   background-size: contain;
   display: inline-block;
   height: 45px;
   width: 45px;
}

.download-btns {
   background: #f4bb0b;
   border-radius: 8px;
   color: #333;
   display: inline-block;
   font-size: 23px;
   font-weight: 700;
   line-height: 80px;
   margin-top: 50px;
   text-align: center;
   width: 288px;
}

.download-btns:hover {
   background: #ffc856;
}

.desktop-assistant-intro {
   padding: 63px 0;
   text-align: center;
}

.features-wrapper {
   margin: 64px 0;
}

.lazyload-placeholder {
   height: 20px;
}

.videos-wrapper {
   background: #ccc;
   border-radius: 8px;
   display: inline-block;
   height: 408px;
   overflow: hidden;
   position: relative;
   vertical-align: top;
   width: 726px;
}

.images.active,
.videos.active {
   display: block;
}

.images,
.videos {
   display: none;
   height: 100%;
   left: 0;
   -o-object-fit: fill;
   object-fit: fill;
   position: absolute;
   top: 0;
   width: 100%;
}

.features-aside {
   display: inline-block;
   margin-left: 66px;
   text-align: left;
   vertical-align: top;
}

.feature-item {
   cursor: pointer;
   margin-bottom: 54px;
}

.feature-item.active.arrange .feature-icon {
   background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1OS41IiBoZWlnaHQ9IjU5LjUiPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iYSIgeDE9IjcwLjcxMSUiIHgyPSIwJSIgeTE9IjcwLjcxMSUiIHkyPSIwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzA3MDAwMCIgc3RvcC1vcGFjaXR5PSIuNDYiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNGRkYiIHN0b3Atb3BhY2l0eT0iLjQ2Ii8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHBhdGggc3Ryb2tlPSIjRjhCQTI3IiBmaWxsPSJub25lIiBkPSJNMjguNS41YzE1LjQ2NCAwIDI4IDEyLjUzNiAyOCAyOHMtMTIuNTM2IDI4LTI4IDI4LTI4LTEyLjUzNi0yOC0yOCAxMi41MzYtMjggMjgtMjh6Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSIjRjhCQTI3IiBkPSJNMjguNSA0LjVjMTMuMjU1IDAgMjQgMTAuNzQ1IDI0IDI0cy0xMC43NDUgMjQtMjQgMjQtMjQtMTAuNzQ1LTI0LTI0IDEwLjc0NS0yNCAyNC0yNHoiLz48cGF0aCBzdHJva2U9IiNGRkYiIHN0cm9rZS13aWR0aD0iNSIgb3BhY2l0eT0iLjMwMiIgZmlsbD0ibm9uZSIgZD0iTTIyLjUgMTAuNWM2LjYyNyAwIDEyIDUuMzczIDEyIDEycy01LjM3MyAxMi0xMiAxMi0xMi01LjM3My0xMi0xMiA1LjM3My0xMiAxMi0xMnoiLz48cGF0aCBzdHJva2U9IiNGRkYiIHN0cm9rZS13aWR0aD0iNSIgZmlsbD0ibm9uZSIgZD0iTTIyLjUgMTQuNWE4IDggMCAxIDEgMCAxNiA4IDggMCAwIDEgMC0xNnoiLz48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9IiMzMzMiIGQ9Im0zMi4xMjcgNDUuMjUyLTcuNTc4LTIxLjgwNCAyMS44MDQgNy41NzgtOS44MzggNC43NTYtNC4zODggOS40N3oiLz48cGF0aCBmaWxsPSJ1cmwoI2EpIiBkPSJtMzIuMTI3IDQ1LjI1Mi03LjU3OC0yMS44MDQgMjEuODA0IDcuNTc4LTkuODM4IDQuNzU2LTQuMzg4IDkuNDd6Ii8+PC9zdmc+);
}

.feature-item.arrange .feature-icon {
   background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1OS41IiBoZWlnaHQ9IjU5LjUiPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iYSIgeDE9IjcwLjcxMSUiIHgyPSIwJSIgeTE9IjcwLjcxMSUiIHkyPSIwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzA3MDAwMCIgc3RvcC1vcGFjaXR5PSIuNDYiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNGRkYiIHN0b3Atb3BhY2l0eT0iLjQ2Ii8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBvcGFjaXR5PSIuMiIgZmlsbD0iI0Y4QkEyNyIgZD0iTTI4LjUgNC41YzEzLjI1NSAwIDI0IDEwLjc0NSAyNCAyNHMtMTAuNzQ1IDI0LTI0IDI0LTI0LTEwLjc0NS0yNC0yNCAxMC43NDUtMjQgMjQtMjR6Ii8+PHBhdGggc3Ryb2tlPSIjRkZGIiBzdHJva2Utd2lkdGg9IjUiIG9wYWNpdHk9Ii4zMDIiIGZpbGw9Im5vbmUiIGQ9Ik0yMi41IDEwLjVjNi42MjcgMCAxMiA1LjM3MyAxMiAxMnMtNS4zNzMgMTItMTIgMTItMTItNS4zNzMtMTItMTIgNS4zNzMtMTIgMTItMTJ6Ii8+PHBhdGggc3Ryb2tlPSIjRkZGIiBzdHJva2Utd2lkdGg9IjUiIGZpbGw9Im5vbmUiIGQ9Ik0yMi41IDE0LjVhOCA4IDAgMSAxIDAgMTYgOCA4IDAgMCAxIDAtMTZ6Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSIjMzMzIiBkPSJtMzIuMTI3IDQ1LjI1Mi03LjU3OC0yMS44MDQgMjEuODA0IDcuNTc4LTkuODM4IDQuNzU2LTQuMzg4IDkuNDd6Ii8+PHBhdGggZmlsbD0idXJsKCNhKSIgZD0ibTMyLjEyNyA0NS4yNTItNy41NzgtMjEuODA0IDIxLjgwNCA3LjU3OC05LjgzOCA0Ljc1Ni00LjM4OCA5LjQ3eiIvPjwvc3ZnPg==);
}

.feature-icon {
   background-repeat: no-repeat;
   background-size: 100% 100%;
   height: 56px;
   margin-right: 20px;
   width: 56px;
}

.feature-icon,
.feature-info {
   display: inline-block;
   vertical-align: middle;
}

.feature-item.active h4 {
   color: #ff9023;
}

.feature-item h4 {
   font-size: 24px;
   margin-bottom: 2px;
}

.feature-item.active.switch .feature-icon {
   background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1Ny41IiBoZWlnaHQ9IjU3LjUiPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbD0iI0Y4QkEyNyIgZD0iTTI4LjUgNC41YzEzLjI1NSAwIDI0IDEwLjc0NSAyNCAyNHMtMTAuNzQ1IDI0LTI0IDI0LTI0LTEwLjc0NS0yNC0yNCAxMC43NDUtMjQgMjQtMjR6Ii8+PHBhdGggc3Ryb2tlPSIjRjhCQTI3IiBmaWxsPSJub25lIiBkPSJNMjguNS41YzE1LjQ2NCAwIDI4IDEyLjUzNiAyOCAyOHMtMTIuNTM2IDI4LTI4IDI4LTI4LTEyLjUzNi0yOC0yOCAxMi41MzYtMjggMjgtMjh6Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSIjRkZGIiBkPSJNMTYuNSAxNi41aDE2YTQgNCAwIDAgMSA0IDR2MTBhNCA0IDAgMCAxLTQgNGgtMTZhNCA0IDAgMCAxLTQtNHYtMTBhNCA0IDAgMCAxIDQtNHoiLz48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9IiNGOEJBMjciIGQ9Ik0xOS41IDE5LjVhMiAyIDAgMSAxIC4wMDEgMy45OTlBMiAyIDAgMCAxIDE5LjUgMTkuNXptLTQuNjU3IDEzIDUuNjU3LTUuNjU3IDUuNjU3IDUuNjU3Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSIjRjhCQTI3IiBkPSJtMjEuODQzIDMyLjUgNy42NTctOC42NTcgNS42NTcgOC42NTciLz48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9IiMzMzMiIGQ9Ik0zNS41IDI0LjVjNi4wNzUgMCAxMSA0LjkyNSAxMSAxMXMtNC45MjUgMTEtMTEgMTEtMTEtNC45MjUtMTEtMTEgNC45MjUtMTEgMTEtMTF6Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSIjRjhCQTI3IiBkPSJtNDAuNSAzNy41LTQgNHYtMTFoMnY3aDJ6bS04LTNoLTJsNC00djExaC0ydi03eiIvPjwvc3ZnPg==);
}

.feature-item.switch .feature-icon {
   background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1Ny41IiBoZWlnaHQ9IjU3LjUiPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgb3BhY2l0eT0iLjIiIGZpbGw9IiNGOEJBMjciIGQ9Ik0yOC41IDQuNWMxMy4yNTUgMCAyNCAxMC43NDUgMjQgMjRzLTEwLjc0NSAyNC0yNCAyNC0yNC0xMC43NDUtMjQtMjQgMTAuNzQ1LTI0IDI0LTI0eiIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbD0iI0ZGRiIgZD0iTTE2LjUgMTYuNWgxNmE0IDQgMCAwIDEgNCA0djEwYTQgNCAwIDAgMS00IDRoLTE2YTQgNCAwIDAgMS00LTR2LTEwYTQgNCAwIDAgMSA0LTR6Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSIjRjhCQTI3IiBkPSJNMTkuNSAxOS41YTIgMiAwIDEgMSAuMDAxIDMuOTk5QTIgMiAwIDAgMSAxOS41IDE5LjV6bS00LjY1NyAxMyA1LjY1Ny01LjY1NyA1LjY1NyA1LjY1NyIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbD0iI0Y4QkEyNyIgZD0ibTIxLjg0MyAzMi41IDcuNjU3LTguNjU3IDUuNjU3IDguNjU3Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSIjMzMzIiBkPSJNMzUuNSAyNC41YzYuMDc1IDAgMTEgNC45MjUgMTEgMTFzLTQuOTI1IDExLTExIDExLTExLTQuOTI1LTExLTExIDQuOTI1LTExIDExLTExeiIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbD0iI0Y4QkEyNyIgZD0ibTQwLjUgMzcuNS00IDR2LTExaDJ2N2gyem0tOC0zaC0ybDQtNHYxMWgtMnYtN3oiLz48L3N2Zz4=);
}

.feature-item.active.taskbar .feature-icon {
   background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1Ny41IiBoZWlnaHQ9IjU3LjUiPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbD0iI0Y4QkEyNyIgZD0iTTI4LjUgNC41YzEzLjI1NSAwIDI0IDEwLjc0NSAyNCAyNHMtMTAuNzQ1IDI0LTI0IDI0LTI0LTEwLjc0NS0yNC0yNCAxMC43NDUtMjQgMjQtMjR6Ii8+PHBhdGggc3Ryb2tlPSIjRjhCQTI3IiBmaWxsPSJub25lIiBkPSJNMjguNS41YzE1LjQ2NCAwIDI4IDEyLjUzNiAyOCAyOHMtMTIuNTM2IDI4LTI4IDI4LTI4LTEyLjUzNi0yOC0yOCAxMi41MzYtMjggMjgtMjh6Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSIjRkZGIiBkPSJNMTYuNSAxNi41aDE2YTQgNCAwIDAgMSA0IDR2MTBhNCA0IDAgMCAxLTQgNGgtMTZhNCA0IDAgMCAxLTQtNHYtMTBhNCA0IDAgMCAxIDQtNHoiLz48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9IiNGOEJBMjciIGQ9Ik0zMi41IDMyLjVoLTE2YTIgMiAwIDAgMS0yLTJ2LTRhMiAyIDAgMCAxIDItMmgxNmEyIDIgMCAwIDEgMiAydjRhMiAyIDAgMCAxLTIgMnptMC0xMGgtMTZhMiAyIDAgMSAxIDAtNGgxNmEyIDIgMCAxIDEgMCA0eiIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbD0iIzMzMyIgZD0iTTM1LjUgMjQuNWM2LjA3NSAwIDExIDQuOTI1IDExIDExcy00LjkyNSAxMS0xMSAxMS0xMS00LjkyNS0xMS0xMSA0LjkyNS0xMSAxMS0xMXoiLz48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9IiNGOEJBMjciIGQ9Im0yOC40MjkgMjkuODQzIDEuNDE0LTEuNDE0IDEyLjcyOCAxMi43MjgtMS40MTQgMS40MTQtMTIuNzI4LTEyLjcyOHoiLz48L3N2Zz4=);
}

.feature-item.taskbar .feature-icon {
   background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1Ny41IiBoZWlnaHQ9IjU3LjUiPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgb3BhY2l0eT0iLjIiIGZpbGw9IiNGOEJBMjciIGQ9Ik0yOC41IDQuNWMxMy4yNTUgMCAyNCAxMC43NDUgMjQgMjRzLTEwLjc0NSAyNC0yNCAyNC0yNC0xMC43NDUtMjQtMjQgMTAuNzQ1LTI0IDI0LTI0eiIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbD0iI0ZGRiIgZD0iTTE2LjUgMTYuNWgxNmE0IDQgMCAwIDEgNCA0djEwYTQgNCAwIDAgMS00IDRoLTE2YTQgNCAwIDAgMS00LTR2LTEwYTQgNCAwIDAgMSA0LTR6Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSIjRjhCQTI3IiBkPSJNMzIuNSAzMi41aC0xNmEyIDIgMCAwIDEtMi0ydi00YTIgMiAwIDAgMSAyLTJoMTZhMiAyIDAgMCAxIDIgMnY0YTIgMiAwIDAgMS0yIDJ6bTAtMTBoLTE2YTIgMiAwIDEgMSAwLTRoMTZhMiAyIDAgMSAxIDAgNHoiLz48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9IiMzMzMiIGQ9Ik0zNS41IDI0LjVjNi4wNzUgMCAxMSA0LjkyNSAxMSAxMXMtNC45MjUgMTEtMTEgMTEtMTEtNC45MjUtMTEtMTEgNC45MjUtMTEgMTEtMTF6Ii8+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSIjRjhCQTI3IiBkPSJtMjguNDI5IDI5Ljg0MyAxLjQxNC0xLjQxNCAxMi43MjggMTIuNzI4LTEuNDE0IDEuNDE0LTEyLjcyOC0xMi43Mjh6Ii8+PC9zdmc+);
}

.download-btnss {
   background: #f4bb0b;
   border: 2px solid #f8c35c;
   border-radius: 12px;
   color: #333;
   display: inline-block;
   font-size: 18px;
   font-weight: 700;
   line-height: 56px;
   text-align: center;
   width: 184px;
}

.download-btnss:hover {
   background: #ffc856;
}

.site-footer {
   background: #f6f6f6;
   border-top: 2px solid #e3e5ea;
   color: #000;
   font-size: 14px;
   font-weight: 400;
   line-height: 28px;
   padding: 10px;
   text-align: center;
}