Template:CPU CHINA/vue-navigation-bar.css

.vnb {

 background: #eee;
 padding-top: 15px;
 padding-bottom: 15px;
 display: flex;
 flex-direction: row;
 align-items: center;
 justify-content: space-between;

} .vnb * {

   box-sizing: border-box;

} .vnb a {

   text-decoration: none;

} .tippy-tooltip {

 padding: 0;

} .vnb-image {

 max-width: 100%;
 height: auto;

}

/*# sourceMappingURL=vue-navigation-bar.vue.map */.vnb__brand-image-wrapper {

 padding-left: 10px;

} .vnb__brand-image-wrapper__link__image {

   max-height: 34px;

} .vnb-image {

 max-width: 100%;
 height: auto;

}

/*# sourceMappingURL=BrandImage.vue.map */.vnb__menu-options {

 display: flex;
 flex-direction: row;
 align-items: center;

} .vnb__menu-options--left {

   margin-right: auto;
   justify-content: flex-start;
   padding-left: 30px;

} .vnb__menu-options--right {

   margin-left: auto;
   justify-content: flex-end;
   padding-right: 10px;

} .vnb__menu-options__option:not(:last-child) {

   margin-right: 20px;

}

/*# sourceMappingURL=MenuOptions.vue.map */.vnb__collapse-button {

 cursor: pointer;
 border: 0;
 background: transparent;
 margin-right: 10px;

} .vnb__collapse-button:hover {

   opacity: 0.75;

} .vnb__collapse-button__image {

   max-height: 30px;

}

/*# sourceMappingURL=CollapseButton.vue.map */.vnb__popup {

 background: #fff;
 position: absolute;
 left: 10px;
 top: 10px;
 right: 10px;
 display: flex;
 flex-direction: column;
 perspective: 2000px;
 box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.1);
 margin-bottom: 20px;
 z-index: 100000;

} .vnb__popup__top {

   padding: 15px 24px 0;
   border-top: 1px solid #e0e0e0;
   border-left: 1px solid #e0e0e0;
   border-right: 1px solid #e0e0e0;
   border-top-right-radius: 6px;
   border-top-left-radius: 6px;

} .vnb__popup__top__image {

     max-height: 27px;
     margin-bottom: 5px;

} .vnb__popup__top__close-button {

     position: absolute;
     top: 10px;
     right: 10px;
     cursor: pointer;
     border: 0;
     background: transparent;

} .vnb__popup__top__close-button:hover {

       opacity: 0.75;

} .vnb__popup__top__close-button__image {

       max-height: 15px;

} .vnb__popup__bottom {

   background: #fff;
   padding: 10px 0 10px;
   border-left: 1px solid #e0e0e0;
   border-right: 1px solid #e0e0e0;
   border-bottom: 1px solid #e0e0e0;
   border-bottom-right-radius: 6px;
   border-bottom-left-radius: 6px;

} .vnb__popup__bottom__menu-options {

     list-style-type: none;
     padding-left: 0;
     display: flex;
     flex-direction: column;

} .vnb__popup__bottom__menu-options__option:not(:last-child) {

       margin-bottom: 10px;

} .vnb__popup__bottom__menu-options__option__link {

       padding: 12px 24px;
       color: #595959;
       font-weight: 500;
       display: inline-block;
       transition: color 0.2s ease-in, background 0.2s ease-in, border 0.2s ease-in;
       border-left: 2px solid #fff;
       width: 100%;

} .vnb__popup__bottom__menu-options__option__link:hover {

         color: #333;
         text-decoration: none;
         background: #f3f3f3;
         border-left: 2px solid #007AFF;

} .vnb__popup__bottom__menu-options__option__link--no-highlight {

         padding: 12px 24px 6px;
         font-weight: 400;
         font-size: 0.8rem;
         color: #757575;

} .vnb__popup__bottom__menu-options__option__link--no-highlight:hover {

           color: #757575;
           background: #fff;
           border-left: 2px solid #fff;

} .vnb__popup__bottom__sub-menu-options {

     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     width: 100%;
     font-size: 0.9rem;

} .vnb__popup__bottom__sub-menu-options__option {

       width: 100%;

} .vnb__popup__bottom__sub-menu-options__option__link {

         padding: 6px 24px;
         width: 100%;
         display: block;
         color: #666666;
         font-weight: 500;
         transition: color 0.2s ease-in, background 0.2s ease-in, border 0.2s ease-in;
         border-left: 2px solid #fff;

} .vnb__popup__bottom__sub-menu-options__option__link:hover {

           color: #333;
           text-decoration: none;
           background: #eee;
           border-left: 2px solid #333;

} .vnb__popup__bottom__sub-menu-options__option__link__sub-text {

           margin-top: 5px;
           display: block;
           font-size: 0.75rem;

} .vnb-image {

 max-width: 100%;
 height: auto;

}

/*# sourceMappingURL=Popup.vue.map */.vnb__menu-options__option__link {

 cursor: pointer;
 font-weight: 500;
 color: #666666;
 transition: color 0.2s ease-in;
 display: flex;
 flex-direction: row;
 align-items: center;
 justify-content: center;

} .vnb__menu-options__option__link:hover {

   color: #333;
   text-decoration: none;

} .vnb__menu-options__option__arrow {

 margin-left: 8px;
 max-height: 5px;
 transition: transform 0.2s ease-in-out;

} .vnb__menu-options__option__arrow--hover {

   transform: rotate(180deg);

} .vnb__sub-menu-options {

 background: #fff;
 max-width: 500px;
 display: flex;
 flex-direction: column;
 justify-content: center;
 align-items: center;
 border-radius: 4px;
 padding: 10px 0;

} .vnb__sub-menu-options__option {

   min-width: 250px;
   max-width: 300px;

} .vnb__sub-menu-options__option__link {

     padding: 12px 12px;
     width: 100%;
     display: block;
     text-align: left;
     color: #666666;
     transition: color 0.2s ease-in, background 0.2s ease-in, border 0.2s ease-in;
     border-left: 2px solid #fff;

} .vnb__sub-menu-options__option__link:hover {

       color: #333;
       text-decoration: none;
       background: #f3f3f3;
       border-left: 2px solid #007AFF;

} .vnb__sub-menu-options__option__link__sub-text {

       margin-top: 5px;
       display: block;
       font-size: 0.75rem;

} .vnb__sub-menu-options__option__hr {

     margin-top: 10px;
     margin-bottom: 10px;
     border-color: rgba(0, 0, 0, 0.1);

}

/*# sourceMappingURL=DesktopMenuItemLink.vue.map */.vnb__menu-options__option__button {

 display: inline-block;
 font-weight: 400;
 color: #fff;
 text-align: center;
 vertical-align: middle;
 user-select: none;
 font-size: 0.9rem;
 line-height: 1.0;
 border-radius: .25rem;
 text-transform: uppercase;
 letter-spacing: 1px;
 padding: 0.5rem 1rem;
 transition: background 0.2s ease-in;

} .vnb-button {

 background: #007AFF;

} .vnb-button:hover {

   color: #fff;
   background: #0062cc;
   text-decoration: none;

}

/*# sourceMappingURL=DesktopMenuItemButton.vue.map */.vnb__menu-options__option__spacer {

 width: 30px;

}

/*# sourceMappingURL=DesktopMenuItemSpacer.vue.map */.tippy-tooltip.light-theme{color:#26323d;box-shadow:0 0 20px 4px rgba(154,161,177,.15),0 4px 80px -8px rgba(36,40,47,.25),0 4px 4px -2px rgba(91,94,105,.15);background-color:#fff}.tippy-tooltip.light-theme[x-placement^=top] .tippy-arrow{border-top:8px solid #fff;border-right:8px solid transparent;border-left:8px solid transparent}.tippy-tooltip.light-theme[x-placement^=bottom] .tippy-arrow{border-bottom:8px solid #fff;border-right:8px solid transparent;border-left:8px solid transparent}.tippy-tooltip.light-theme[x-placement^=left] .tippy-arrow{border-left:8px solid #fff;border-top:8px solid transparent;border-bottom:8px solid transparent}.tippy-tooltip.light-theme[x-placement^=right] .tippy-arrow{border-right:8px solid #fff;border-top:8px solid transparent;border-bottom:8px solid transparent}.tippy-tooltip.light-theme .tippy-backdrop{background-color:#fff}.tippy-tooltip.light-theme .tippy-roundarrow{fill:#fff}.tippy-tooltip.light-theme[data-animatefill]{background-color:transparent}