html { scroll-padding-top: 100px; } body { font-family: 'Lato', sans-serif; font-size: 18px; color: #1a1a1a; } .ns-callout { background-color: #e8e8e8; border-color: #1e5f7b; padding: 15px 30px 15px 15px; border-left: 5px solid #1a1a1a; } h1 { font-size: 46px; } .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { font-weight: 600; } .navbar-custom { font-family: "Open Sans", sans-serif; max-width: 1600px; margin: 0 auto; } header.fixed-top .navbar-custom img.onnx-logo { width: 205px; height: 70px; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } header.fixed-top { padding: 12px 0; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } header.fixed-top.scrolled { padding: 0 0; background-color: #D8D6D6; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } .navbar-custom .navbar-nav .nav-link { color: #1a1a1a; font-weight: bold; position: relative; padding: 0; line-height: 1; } .navbar-custom .navbar-nav .nav-item { padding: .5rem 0 .5rem 1rem; } .navbar-custom .navbar-nav .nav-item.active .nav-link { color: #0B5CA2; } .navbar-custom .navbar-nav .nav-item .nav-link:hover { color: #0B5CA2; } header.scrolled .navbar-custom .navbar-nav .nav-item.active .nav-link { color: #0B5CA2; } header.scrolled .navbar-custom .navbar-nav .nav-item .nav-link:hover { color: #0B5CA2; } header.scrolled .navbar-custom .navbar-nav .nav-link { color: #1a1a1a; } .navbar-custom .navbar-nav .nav-item:not(:last-child) .nav-link { border-right: 2px solid #0B5CA2; } header.scrolled .navbar-custom .navbar-nav .nav-item:not(:last-child) .nav-link { border-right: 2px solid #1a1a1a; } .navbar-toggler .navbar-toggler-icon { background-image: url('../images/svg/menu-icon.svg'); width: 3em; height: 3em; -webkit-transition: 0.2s; transition: 0.2s; } header.header-collapse .navbar-toggler .navbar-toggler-icon { background-image: url('../images/svg/menu-cross-icon.svg'); width: 2.5em; height: 2.5em; -webkit-transition: 0.2s; transition: 0.2s; } .outer-container { max-width: 1280px; } .btn-blue { background-color: #0F77D2; border: 0; border-radius: 0; font-size: 18px; font-weight: 600; outline: none; } .btn-blue:hover, .btn-blue:focus, .btn-blue:active { background-color: #0F77D2 !important; border: 0; outline: none; } a.link { color: #0F77D2; font-weight: 600; position: relative; text-decoration: none; } a.link:hover .link-content, a.link:focus .link-content, a.link:active .link-content { border-bottom: 2px solid #045DA0; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } .link-arrow { padding-left: 5px; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } .link-arrow.fa-angle-right { color: #1a1a1a; } a.link:hover .link-arrow.fa-angle-right, a.link:focus .link-arrow.fa-angle-right, a.link:active .link-arrow.fa-angle-right { color: #045DA0; } a.link:hover, a.link:focus, a.link:active { color: #045DA0; } a.link:hover .link-arrow, a.link:focus .link-arrow, a.link:active .link-arrow { padding-left: 10px; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } .get-started-section h2 { font-size: 30px; } .tab-wrapper { margin: 3rem auto; padding: 0 70px; } .carousel { padding: 0 70px; } .carousel .item, .tab-wrapper .item { color: #000; overflow: hidden; min-height: 120px; font-size: 26px; } .carousel .media img, .tab-wrapper .media img { max-width: 100%; height: auto; display: block; } .carousel .testimonial, .tab-wrapper .testimonial { position: relative; } .video { max-width: 100%; aspect-ratio: 16 / 9; } .carousel p, .tab-wrapper p { font-size: 26px; font-weight: bold; } .carousel .overview, .tab-wrapper .overview { font-size: 16px; margin-bottom: 30px; font-weight: normal; } .carousel-control-prev { width: 5%; justify-content: left; } .carousel-control-next { width: 5%; justify-content: right; } .carousel-control-prev-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3e%3c/svg%3e") } .carousel-control-next-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3e%3c/svg%3e") } .carousel .carousel-indicators { bottom: -40px; } .carousel-indicators li, .carousel-indicators li.active { width: 18px; height: 18px; border-radius: 50%; margin: 1px 3px; } .carousel-indicators li { border: 2px solid #4D4D4D; width: 11px; height: 11px; } .carousel-indicators li.active { width: 11px; height: 11px; color: #fff; background: #1fa2ff; border: 2px solid transparent; ; } .main-wrapper .top-banner-bg { background-image: url(../images/top-banner-background.jpg); background-size: auto; background-position: top center; background-repeat: repeat no-repeat; } .icon-container img { width: 50px; height: 55px; } .customer-logo img { max-width: 65%; /* padding-right: 5px; padding-left: 5px; */ } .ms-logo img { max-width: 100%; padding-right: 20px; padding-left: 20px; } div.customer-logo:hover { background-color: #e8e8e8; transition: .4s; } .blue-text { color: #1fa2ff; } h3.blue-text { font-weight: 700; } .article-blurb { color: #000000; } .article-date { color: #666666; text-transform: uppercase; font-size: 14px; } .news { background-color: #e8e8e8; padding: 2rem; font-size: 18px; margin: 2rem; } .alert { background-color: #E6EFF4 !important; color: #000000 !important; border: 0px !important; text-align: center !important; border-radius: 0% !important; } .alert a { color: #007bff !important; font-weight: bold !important; } .news:hover { background-color: #fff; box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .20); -webkit-transition: all 200ms ease-in -out; transition: all 200ms ease-in-out; } .bold-text { font-weight: bold; } .custom-list { list-style: none; } .ft-20 { font-size: 20px; } .pr-10 { padding-right: 10%; } .bg-lightgray { background-color: #e8e8e8 } .border-top { border-top: 1px solid #b3b3b3 !important; } /***Sticky Footer***/ .footer { background-color: #333333; } .footer h2 { font-size: 30px; } .footer .footer-heading { color: #ffffff; font-size: 28px; margin-right: 60px; } .footer a { font-size: 20px; color: #1fa2ff; text-decoration: none; padding-right: 0; position: relative; display: inline-block; } .footer a .fa-twitter { font-size: 30px; } .footer a:hover, .footer a:focus, .footer a:active { color: #a0dcf9; } .footer a .link-content { box-shadow: 0 2px #1fa2ff; } .footer a:hover .link-content, .footer a:focus .link-content, .footer a:active .link-content { border-bottom: 2px solid #a0dcf9; -webkit-transition: all 200ms ease-in -out; transition: all 200ms ease-in-out; } .footer .link-arrow { padding-left: 5px; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } .footer .link-arrow.fa-angle-right { color: #ffffff; } .footer a:hover .link-arrow.fa-angle-right, .footer a:active .link-arrow.fa-angle-right, .footer a:focus .link-arrow.fa-angle-right { color: #a0dcf9; } .footer a:hover .link-arrow, .footer a:active .link-arrow, .footer a:focus .link-arrow { padding-left: 10px; } .footer a.twitter-icon::after { display: none; } p.text-copyright { font-size: 14px; display: inline-block; } .footer .onnx-footer-logo { width: 205px; height: 70px; } .back-to-top { position: fixed; bottom: 25px; right: 25px; background-color: #007bff; width: 50px; height: 50px; padding: 0; border: 0; border-radius: 0; outline: transparent; display: none; } .back-to-top .fa-angle-up { font-size: 44px; color: #ffffff; } .back-to-top:hover, .back-to-top:focus, .back-to-top:active { background-color: #1FA2FF; } .skip-main { left: -999px; position: absolute; top: auto; width: 1px; height: 1px; overflow: hidden; z-index: -999; cursor: pointer; } .skip-main:focus, .skip-main:active { color: #fff; background-color: #000; left: auto; top: auto; width: 230px; height: auto; overflow: auto; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); padding: 5px; border-radius: 0; text-align: center; font-size: 1.2em; z-index: 9999; border: none; } .append-play-buttom aside { text-align: center; position: relative; top: -48px; margin-left: 10%; width: auto; } .carousel-pause-button { font-size: 16px; background: none; border: none; position: relative; margin: 0; line-height: 1; z-index: 111; } .abbr[data-original-title], abbr[title] { text-decoration: none; -webkit-text-decoration: none; text-decoration: none; } a .abbr[data-original-title], a abbr[title] { cursor: pointer; } .quick-starts .col-md-2-4 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } [role=radio] { display: block; position: relative; margin: 0.5em; padding-left: 20px; border: thin transparent solid; } .r-wrap .r-heading h3 { color: #000; font-size: 22px; margin: 0; } .r-wrap .r-heading { position: relative; text-align: left; padding: 0 20px; background-color: #E6EFF4; color: #000; margin: 2px 0; -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; min-height: 40px; } .r-wrap.command-block .col-md-3.r-heading { background-color: #007bff; border: 1px solid #fff; } .r-wrap.command-block .r-heading::before { border-left: none; } .r-wrap.command-block .r-heading h4::before { display: block; color: transparent; height: 83px; position: absolute; left: 15px; border-left: 2px solid #000; top: 0px; } .r-wrap .r-content { width: 100%; margin: 0; cursor: pointer; } .r-wrap .r-content .row { margin-right: 0; } div.quotebox { border: 1px solid #cccccc; background-color: #e8e8e8; padding-top: 15px; } .quotebox img { max-height: 180px; } .r-wrap .r-content .r-option, .r-wrap .r-content .col-disable { margin: 0; padding: 0; } .r-wrap .r-content .r-option span, .r-wrap .r-content .col-disable span { cursor: pointer; color: #000000; padding: 0 20px; font-weight: 400; font-size: 16px; margin: 2px 2px; background-color: #fafafa; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; min-height: 40px; word-break: break-word; } .r-wrap .r-content .r-option.selected span, .r-wrap .r-content .r-option.selected span:hover, .r-wrap .r-content .r-option.selected span:focus, .r-wrap .r-content .r-option.selected span:active { background-color: #007bff; color: #fff; border: 0px solid #000; } .r-wrap .r-content .r-option.unsupported span, .r-wrap .r-content .r-option.unsupported span:hover, .r-wrap .r-content .r-option.unsupported span:focus, .r-wrap .r-content .r-option.unsupported span:active { border: 2px solid #cc0000; } .r-wrap .r-content .r-option.gray span, .r-wrap .r-content .r-option.gray span:hover, .r-wrap .r-content .r-option.gray span:focus, .r-wrap .r-content .r-option.gray span:active { background-color: #eee; color: #999; } .r-wrap .r-content .r-option.command-container a { color: #fff; text-decoration: underline; font-weight: bold; } .r-wrap .r-content .r-option.command-container { display: table; padding: 2px 2px 2px 2.3px; } .r-wrap .r-content .r-option.command-container span { display: table-cell; padding: 0 10px 0 20px; vertical-align: middle; background-color: #000; color: #fff; } .r-wrap .r-content #command.r-option.valid span, .r-wrap .r-content #command.r-option.valid span:hover, .r-wrap .r-content #ot_command.r-option.valid span, .r-wrap .r-content #ot_command.r-option.valid span:hover { background-color: green; } .r-wrap .r-content #command.r-option.invalid span, .r-wrap .r-content #command.r-option.invalid span:hover, .r-wrap .r-content #ot_command.r-option.invalid span, .r-wrap .r-content #ot_command.r-option.invalid span:hover { border: 2px solid #cc0000; } .r-wrap .r-content .r-option.command-container a.link:hover, .r-wrap .r-content .r-option.command-container a.link:focus, .r-wrap .r-content .r-option.command-container a.link:active { color: #000; } .r-wrap .r-content .r-option span:hover { background-color: #0F77D2; color: #fff; /* border: 1px solid #000; */ } .r-wrap .r-content .r-option.command-container.selected, .r-wrap .r-content .r-option.command-container:hover { color: #212529; } .r-wrap .r-content #command.r-option span:hover, .r-wrap .r-content #ot_command.r-option span:hover { background-color: #000; color: #fff; border: 1px solid #ccc; cursor: default; } .col-disable span:hover, .col-disable span:focus, .col-disable span:active, .r-wrap .r-content .r-option.selected.col-disable span, .r-wrap .r-content .r-option.selected.col-disable span:hover, .r-wrap .r-content .r-option.selected.col-disable span:focus, .r-wrap .r-content .r-option.selected.col-disable span:active { background-color: transparent !important; color: transparent !important; border: 1px solid #ccc !important; cursor: default !important; } .r-wrap.command-block { height: auto; } .col-2dot4, .col-sm-2dot4, .col-md-2dot4, .col-lg-2dot4, .col-xl-2dot4 { position: relative; width: 100%; min-height: 1px; max-height: 1; padding-right: 15px; padding-left: 15px; } @media (min-width: 768px) { .hardwareAcceleration .col-lg-2dot5 { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } } /* new css start */ .subheading { font-size: 24px; } .resources-img img { max-width: 100%; } .news-img img { max-width: 100%; } .news-img { padding-left: 3rem; padding-top: 3rem; } .resources-img { position: relative; display: block; width: 100%; } .resources-img img { cursor: pointer; } .resources-img::before { content: ''; background-image: url('../images/youtube-logo.png'); background-position: center; background-size: 50%; background-repeat: no-repeat; position: absolute; left: 0; top: 0; right: 0; height: 100%; width: auto; background-color: rgba(0, 0, 0, 0.3); cursor: pointer; } .section-heading { font-size: 30px; } .blue-title-columns h3 { font-size: 24px; } .blue-title-columns h3.quote { font-size: 16px; text-align: center; } .blue-title-columns h3.hardware { font-size: 18px; } .row.blue-title-columns { text-align: center; } .blue-title-columns div.quote-attribution { font-size: 18px; font-weight: normal; font-style: italic; color: #0F77D2; text-align: right; } .blue-title-columns h2 { font-size: 24px; } #myModal .close { padding: 6px; position: absolute; right: 12px; top: 8px; z-index: 11; } .tabpanel { margin: 20px; padding: 0; } .tbl_tablist { margin: 2px 0; padding: 0; list-style: none; display: flex; border-bottom: 1px solid #ddd; } .tbl_tab, .custom-tab .nav-tabs .nav-link { margin: 0; padding: 12px 24px; font-weight: bold; border: 1px solid #dddddd; background: #fff; border-top-left-radius: .5em; border-top-right-radius: .5em; border-bottom: 0; font-size: 22px; cursor: pointer; color: #1a1a1a; ; } .tbl_panel { clear: both; display: block; margin: 0 0 0 0; padding: 0; } ul.controlList { list-style-type: none; } li[aria-selected='true'], .custom-tab .nav-tabs .nav-link.active { background-color: #007bff; color: #fff; border: 1px solid #007bff; margin-bottom: -1px; } div.tbl_panel[aria-hidden='true'] { display: none; } div.tbl_panel[aria-hidden='false'] { display: block; }