﻿
#omniverse_top {background-image: url(/images/omniverse/omniverse-banner01.jpg); background-position: center center; background-repeat: no-repeat; background-color: #080808; height: 300px;}
#title_info {color:#e2e2e2;}
.bt-NVcolor {color: #fff; background-color: #76b701; display: inline-block; padding: 10px 30px; border-radius: 2px; letter-spacing: 1px; margin-top: 1rem;}
.card {padding-bottom:20px; background-color:transparent;}
.card img:not(.img-thumbnail) {max-height:80px;margin: 0 auto;}
/*for ie10 、 ie11*/
@media screen and (-ms-high-contrast: active),(-ms-high-contrast: none) {
    .card img { width:90px; height:90px; padding-bottom:10px;}
    .card img.nvidia_rtx { width:120px; height:120px; padding-bottom:0;}
    .card-columns-3, .card-columns-4 { padding-bottom: 0;}
}
.card .title {margin-top:0; font-size:22px;}
ul.link-crumbs > li {color: #8e8e8e;}
ul.link-crumbs > li > a {color: #fff; opacity: .75;}
ul.link-crumbs>li+li:before {color: #fff; opacity: .75 !important;}
#omniverse_top h1.NVColor {font-weight: normal; font-size: 36px; padding: 6px 0; margin-bottom:0;}
#omniverse_top h2 {font-weight: normal; margin-top:0; color: #fff;}
.NVColor {color: #76b900;}
a.NVColor:focus, a.NVColor:active  {color: #76b900;}
a.NVColor:hover {color: #a3ff00;}
.textcomp {font-weight:normal;}
.tabs-wrapper { margin: 0 auto; display: block; width: 100%; overflow: hidden; position: relative;}
.tabs-wrapper ul.tabs {list-style: none; margin: 0; padding: 0; font-size: 0; overflow-x: auto; -ms-overflow-style: none; overflow: -moz-hidden-unscrollable; width: 100%; list-style-position: inside; white-space: nowrap; text-align: center;}
.tabs-wrapper ul.tabs::-webkit-scrollbar { display: none;}
.tabs-wrapper ul.tabs li { width: auto; margin: 0; border-bottom: 1px solid #ccc; padding-bottom: 4px; cursor: pointer; display: inline-block; font-size: 16px; line-height: 24px; list-style: none;}
.tabs-wrapper ul.tabs li.active { border-bottom: 4px solid #76b900; padding-bottom: 1px;}
.tabs-wrapper ul.tabs li.active a { color: #76b900; font-weight: 600;}
.tabs-wrapper ul.tabs li a { color: #000; font-size: 16px; padding-top: 10px; padding-bottom: 0; display: block; line-height: 50px;}

.tab-pane p.h4 { padding-top:65px;}
.tab-pane p.h4:before {content: "\201C"; font-size: 32px; color: #fff; display: inline-block; line-height:0;}
.tab-pane p.h4:after {content: "\201C"; font-size: 32px; color: #fff; display: inline-block; line-height:0; -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg);}

#omniverse_tab { background-image: url(/images/omniverse/omniverse-banner02.jpg); background-position: center top; background-repeat: no-repeat; background-color: #eee; background-size: auto;}
.list-icon { display: block; list-style-type: none; margin-bottom: 30px; padding:0;}
.list-icon li a, .list-icon li a:focus, .list-icon li a:active {color:#000;}
.list-icon li a:hover {color:#a3ff00;}
.list-icon li { width: 100%; line-height: 1.4; font-size: 16px; border-top: 1px solid #565656; text-align: left;  padding: 8px 0 8px 30px;}
.list-icon li:not(.arrow) { background: url(/images/blog-icon.png) 3px 10px no-repeat; background-size: auto 18px;}
.list-icon li.arrow:before { content: "\f105"; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; color: #76b900; margin-right: 10px; display: inline-block;}
.list-icon li.arrow { padding-left: 10px; line-height: 1.2;}
.list-icon li:first-child {border: 0;}
.col-border {padding-top: 20px; padding-bottom:40px; }
.tab-pane h3 { padding: 8px 0; font-size:28px;}
.photo {max-width:100px; float:left; margin: 0 8px 0 0; padding: 1px;}
#tab5 h4 {padding: 0; line-height: 1; margin: 0 0 10px 0;}

.showquotes::before, .showquotes::after {content: "\201C"; display: inline-block; font-size: 50px; letter-spacing: 0.1em; font-family: Helvetica,Arial,Sans-Serif; line-height: 30px; vertical-align: top;}
.showquotes::after {line-height: .2; transform: rotate(180deg);}


@media (min-width: 1200px) {
    .tabs-wrapper ul.tabs li {padding-left: 20px; padding-right: 20px;}
    #omniverse_top {background-position: center right;}
}

@media (max-width: 1199px) {
    .card .title, [class^="card-columns-"] .title {font-size:18px;}
    .tabs-wrapper ul.tabs li {padding-left: 15px; padding-right: 15px;}
    #omniverse_tab .title {font-weight: normal; font-size: 28px; line-height: 32px; padding:20px 0 5px 0;}
    #tab5 .col-md-12 {padding-bottom:30px;}
}

@media (min-width: 992px) {
    #HtmlTag[lang="en-US"] #omniverse_top h2 {font-size:22px;}
    .textcomp {font-size:19px; padding: 20px 0 0;}
    #omniverse_tab .title {font-weight: normal; font-size: 26px; line-height: 30px; padding:20px 0 5px 0;}
    #tab5 h4 {font-size:20px;}
    .card-columns-3 h3.title, .col-sm-3 h3.title {font-size:20px !important; margin: 15px 0 10px; line-height: 1.3 !important;}
    .col-sm-3 { padding-right: 5px; padding-left: 5px;}
}

@media (max-width: 991px) and (min-width: 768px) {
    #HtmlTag[lang="en-US"] #omniverse_top h1 {font-size:30px;}
    h2.title {font-size:26px;}
    #HtmlTag[lang="en-US"] #omniverse_top h2 {font-size:20px;}
    .textcomp {font-size:17px; padding: 10px 0 0;}
    #omniverse_tab .title {font-weight: normal; font-size: 24px; line-height: 26px; padding:15px 0 5px 0;}
    .tabs-wrapper ul.tabs li {padding-left: 15px; padding-right: 15px;}
    #tab5 h4 {font-size:18px;}
    .card-columns-3 h3.title, .col-sm-3 h3.title {font-size:18px !important; margin: 10px 0 5px; line-height: 1.3 !important;}
    .col-sm-3 { padding-right: 2px; padding-left: 2px;}
}

@media (min-width: 768px) {
    .col-R {padding-bottom: 70px;}
    .card-columns-3 {column-count:3; column-gap: .5rem; padding-bottom:40px;}
    .card-columns-4 {column-count:4; column-gap: 1rem; padding-bottom:40px;}
}

@media (max-width: 767px) {
    #HtmlTag[lang="en-US"] #omniverse_top h1 {font-size:28px;}
    h2.title, h2.NVColor {font-size:22px;}
    #HtmlTag[lang="en-US"] #omniverse_top h2 {font-size:18px;}
    #omniverse_top {background-position: center center; background-size: cover;}
    .textcomp {font-size:15px;}
    .card:last-child {padding-bottom:0;}
    .card .title, [class^="card-columns-"] .title {font-size:17px;}
    #omniverse_tab .title {font-weight: normal; font-size: 22px; line-height: 23px; padding:15px 0 0 0;}
    #omniverse_top h1.NVColor {font-size: 30px;}
    .tabs-wrapper ul.tabs li:first-child {margin-left: 0;}
    .col-L {padding-bottom: 0;}
    .col-R {padding-top: 0;}
    .tab-pane p.h4  {font-size:15px; padding-top:0;}
    .tabs-wrapper ul.tabs li {padding-left: 10px; padding-right: 10px;}
    .tabs-wrapper ul.tabs li a {font-size:15px;}
    #tab5 h4 {font-size:17px;}
    .card-columns-3 {padding-bottom:50px;}
    .card-columns-3 h3.title, .col-sm-3 h3.title {font-size:16px !important; margin: 10px 0 5px;}
    .col-sm-3 { padding-right: 2px; padding-left: 2px; margin-bottom:15px;}
}

@media (max-width: 680px) {
    .tabs-wrapper ul.tabs { width: calc(100vw - 40px); overflow-x:auto;}
        .tabs-wrapper ul.tabs::before {
            position: absolute;
            display: block;
            content: "\f141";
            color: #76b900;
            font: normal normal normal 14px/38px FontAwesome;
            text-align: right;
            width: 30px;
            right: 0;
            height: 40px;
            background: rgba(0,0,0,0);
            background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(228,228,228,0.47) 47%, rgba(228,228,228,1) 100%);
            background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,0,0,0)), color-stop(47%, rgba(228,228,228,0.47)), color-stop(100%, rgba(228,228,228,1)));
            background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(228,228,228,0.47) 47%, rgba(228,228,228,1) 100%);
            background: -o-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(228,228,228,0.47) 47%, rgba(228,228,228,1) 100%);
            background: -ms-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(228,228,228,0.47) 47%, rgba(228,228,228,1) 100%);
            background: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(228,228,228,0.47) 47%, rgba(228,228,228,1) 100%);
        }
    .tabs-wrapper ul.tabs.end::before {content: ' '; }
    .tabs-wrapper ul.tabs li {padding-left: 10px; padding-right: 10px;}
    .tabs-wrapper ul.tabs li:last-child {padding-right:10px;}
    .tabs-wrapper ul.tabs li a {font-size:13px; padding-top: 0; line-height:40px;}
    .showquotes::before, .showquotes::after {font-size: 40px;}
}

@media (max-width: 460px) {
    .textcomp {font-size:14px;}
    .card .title, [class^="card-columns-"] .title {font-size:16px;}
    #omniverse_tab .title {font-weight: normal; font-size: 18px; line-height: 18px; padding:0;}
    #omniverse_top h1.NVColor {font-size: 24px; margin:0; padding-top: 30px;}    
    #HtmlTag[lang="en-US"] #omniverse_top h1 {font-size:25px;}
    #HtmlTag[lang="en-US"] #omniverse_top h2 {font-size:16px;}
    .tabs-wrapper ul.tabs li a {font-size:12px; padding-top: 0; line-height:35px;}
    .tab-pane h3 { padding: 0; font-size: 20px !important;}
    .list-icon li {background-size: auto 15px; background-position-y:9px; padding: 8px 0 8px 28px; line-height: 20px;}
    .showquotes::before, .showquotes::after {font-size: 30px;}
}

@media (max-width: 580px) {
    #container_wrap h2.NVColor, #container_wrap h2.title { font-size: 20px; }
}