* { margin: 0; padding: 0; } img { border: 0; } body { margin: 0; padding: 0; } .clear { clear: both; } .hidden { display: none; } p, h1, h2, h3, h4, h5, h6, #mainContent ul, #mainContent ol { /* margin-top: 1em; */ margin-bottom: 1em; } p { line-height: 1.6; } html { /* Standard colorss. */ --khaki-green: #587733; --light-green: #afe478; --washed-green: #daf4be; --light-blue: #92d4d1; --washed-blue: #ddfbfa; --navy: #224c57; --orange: #ec6343; --orange-dim: #e05340; } /* Some Tachyons-like classes to apply those standard colors. */ .bg-light-blue { background: var(--light-blue); } .bg-orange { background: var(--orange); } .orange { color: var(--orange); } .b--light-blue { border-color: var(--light-blue); } .navy { color: var(--navy); } body { /* Native font stack as per Bootstrap 5.1. */ font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; font-size: .875rem; color: #333; } a { text-decoration: none; color: var(--navy); transition: all .1s ease-out; font-weight: bold; } a:hover { text-decoration: underline; } /* Missing links */ a, form { position: relative; } .fixme, a[href$="#fixme"]:before, form[action$="#fixme"]:before { border: 1px solid var(--orange); border-radius: 6px; content: '?'; font-size: 0.6rem; color: var(--orange); position: absolute; top: -4px; right: -4px; padding: 1px; background: yellow; /* opacity: 0.8; */ width: 12px; text-align: center; } input:focus { z-index: 3; border-color: #86b7fe; box-shadow: 0 0 0 .25rem rgb(236, 99, 67, .5); }; a.read-more { cursor: pointer; font-style: italic; } .btn-orange { color: white; background: var(--orange); border: 1px solid var(--orange-dim); } .btn-orange:hover, .btn-orange:active { background: var(--orange-dim); text-decoration: none; box-shadow: 1px 1px 1px rgba(0,0,0,0.2); } .btn-orange:focus { box-shadow: 0 0 0 .25rem var(--orange-dim); } .btn-white { color: var(--orange); background: white; border: 1px solid #777; } .btn-white:hover, .btn-white:active { background: #eee; text-decoration: none; box-shadow: 1px 1px 1px rgba(0,0,0,0.2); } .btn-white:focus { box-shadow: 0 0 0 .25rem #ddd; } a svg { transition: all .2s ease; } a:hover svg { transform: scale(1.1); } .toggle-control { cursor: pointer; text-decoration: none; color: #557733; } .toggle-control:hover { text-decoration: underline; color: #577632; } /* FIXME: We should do this: */ /* http://www.waypointarts.com/blog/2013/06/29/fixing-a-side-bar-while-scrolling-until-bottom */ .donate-sidebar { background: var(--light-green) no-repeat; position: sticky; bottom: 0; width: auto; padding: 0.5rem 1rem; margin: 2rem -0.5rem 0; border-radius: 8px 8px 0 0; border: 1px solid #90d468; } .donate-sidebar:hover { background: #a0d870; } @media screen and (min-width: 30em) { .donate-sidebar { margin: 2rem -1rem 0; } } p.footnote { font-size: 85%; } h1 { margin-top: .75em; margin-bottom: .5em; } h2 { margin-top: .75em; margin-bottom: .5em; } h3 { margin-top: .6em; margin-bottom: .4em; } #mainContent ul, #mainContent ol { padding-left: 1.5em; } .internalNavigate { width: 19%; float: right; } #mainContent .internalNavigate ul { list-style-type: none; padding-left: 0; } .internalNavigate ul li { margin-top: .3em; margin-bottom: .3em; } /* Header */ body > header { /* background: linear-gradient(to top right, white, white, var(--washed-blue) 80%); */ overflow: auto; /* Prevent logo top margin popping out. */ } #conservancyheader img { max-height: 75px; width: auto; } @media screen and (min-width: 30em) { #conservancyheader img { max-height: 90px; } } /* Navigation bar */ #navbar-outer { background: var(--navy); position: relative; z-index: 100; } #navbar ul { list-style: none; text-transform: uppercase; padding: 0; } #navbar li { background: var(--navy); position: relative; padding-left: .25rem; padding-right: .25rem; } @media screen and (min-width: 30em) { #navbar li { padding-left: .5rem; padding-right: .5rem; } } #navbar li > a { display: inline-block; color: white; text-decoration: none; padding: 0.25rem 0.25rem 0; /* Invisible borders to keep things even. */ border-top: 0.20rem solid var(--navy); /* A little less here. */ border-bottom: 0.25rem solid var(--navy); } @media screen and (min-width: 30em) { #navbar li > a { padding-left: .5rem; padding-right: .5rem } } #navbar li a:hover, #navbar li a:focus { border-bottom: 0.25rem solid var(--light-green); } #navbar li { padding-bottom: 0.25rem; } /* Navbar submenus */ #navbar li ul { display: none; z-index: 100; position: absolute; top: 100%; left: 0; min-width: 15rem; text-transform: none; } #navbar li ul a { font-weight: normal; } #navbar li:hover ul { display: block; } /* Right-align the second last and last sub-menus. */ #navbar li:nth-last-child(2) ul, #navbar li:nth-last-child(1) ul { left: auto; right: 0; text-align: right; } #menu-icon:active, #search-icon:active { transform: scale(1.1); } #navbar-outer { min-height: .5rem; } #navbar.mobile { display: block; max-width: 32rem; } #navbar.mobile.search { display: block; } #navbar.mobile li { display: block; } #navbar.mobile ul { padding-left: .5rem; padding-right: .5rem; display: block !important; position: relative !important; top: auto !important; left: 0 !important; right: auto !important; text-align: left !important; } #navbar.mobile > ul > li { padding-top: .5rem; padding-bottom: .5rem; } #navbar.mobile > ul > li { border-bottom: 1px solid rgba(255, 255, 255, 0.2); } #navbar.mobile li ul { margin-left: .5rem; } #progressbar { height: 1.8em; } #progressbar .ui-widget-header { background: rgb(206, 31, 31); } #siteprogressbar .goalText { color: #557733; font-size: 10pt; } #siteprogressbar .soFarText { font-size: 10pt; } #siteprogressbar .progress { background: #577632; } @media all and (max-width: 600px) { .goalText { font-size: 8pt; } .soFarText { font-size: 8pt; } } #siteprogressbar .progress { background: #577632; } #siteprogressbar .middle-goal { background: #d0d0d0; } #siteprogressbar .final-goal { background: #eeeeee; } #fundraiser-percentage { text-align: center; } #container #mainContent { max-width: 50em; margin: 0; padding: 0; background: #ffffff; flex: 1 1 auto; } #container #sidebar { background-color: #e6eae1; padding: 1px 0.5rem 0.25rem; margin-bottom: 1rem; } @media screen and (min-width: 30em) { #container { display: flex; } #container #sidebar { flex: 1 0 15em; margin-right: 1rem; } } #container #sidebar li { text-align: center; list-style: none; padding: 3px 10px 3px 10px; margin: 5px; border: 1px solid #CCC; background: #eaf1f1; background: -moz-linear-gradient(top, #fff, #eaf1f1); background: -webkit-linear-gradient(top, #fff, #eaf1f1); background: linear-gradient(to bottom, #fff, #eaf1f1); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eaf1f1', GradientType=0); } #container #sidebar li a:hover { background: #577632; color: #fff; } #container #sidebar.Directors ul li.Directors, #container #sidebar.Eval ul li.Eval, #container #sidebar.Overview ul li.Overview, #container #sidebar.Contact ul li.Contact, #container #sidebar.Staff ul li.Staff, #container #sidebar.Outside ul li.Outside, #container #sidebar.Transparency ul li.Transparency, #container #sidebar.License ul li.License, #container #sidebar.Current ul li.Current, #container #sidebar.Services ul li.Services, #container #sidebar.Applying ul li.Applying, #container #sidebar.PastLawsuits ul li.PastLawsuits, #container #sidebar.VizioAbout ul li.VizioAbout, #container #sidebar.VizioPressRelease ul li.VizioPressRelase, #container #sidebar.VizioComplaint ul li.VizioPressComplaint, #container #sidebar.VizioPressKit ul li.VizioPressKit, #container #sidebar.VizioPhotoAssets ul li.VizioPhotoAssets, #container #sidebar.VizioQandA ul li.VizioQandA, #container #sidebar.Glossary ul li.Glossary, #container #sidebar.CopyleftPrinciples ul li.CopyleftPrinciples, #container #sidebar.AboutCompliance ul li.AboutCompliance, #container #sidebar.HelpComply ul li.HelpComply, #container #sidebar.EnforcementStrategy ul li.EnforcementStrategy, #container #sidebar.LiberateFirmware ul li.LiberateFirmware { color: #000033; font-weight: bold; background: #e3e6e0; } #container #sidebar h2 { text-align: center; font-size: 1.25em; margin: 1.5em 0 0.8em 0; } #container #sidebar hr { width: 75%; float: center; clear: all; } .shaded { background: #F0FFB8; padding: .1em .5em; margin-bottom: .5em; } .columns { } .column h2 { font-size: 1.25em; } .column h3 { font-size: 1.1em; } .column hr { width: 50%; margin-left: auto; margin-right: auto; } .column h2 a { text-decoration: none; color: #000000; } .column h2 a:hover { text-decoration: underline; } #conservancyfooter { border-top: 1px solid #ccc; text-align: center; overflow: auto; } .continued { display: block; font-size: .9em; font-weight: bold; margin-top: 1em; margin-bottom: 1em; } .date, .blog-tags, .blog-comments { font-style: italic; font-size: .9em; margin-bottom: .3em; margin-top: .3em; } a.feedlink /* RSS icon */ { display: block; float: right; font-size: 10pt; } blockquote, div.quote /* div.quote is used by conservancy whitepaper */ { margin-left: 2em; margin-right: 2em; padding-left: 1em; padding-right: 1em; border: 1px solid #fff; background: #eee; } .newsgraphic { float: right; } .newsgraphic img { border: 1px solid #000; } .picture { text-align: center; font-style: italic; } .picture img { margin: 0 auto; max-width: 100%; } .picture-small { padding-left: 1em; border: thin silver solid; padding: 0.5em; text-align: center; font-style: italic; font-size: 70%; text-indent: 0; margin: .25em; min-width: 8%; width: auto; box-shadow: 1px 1px 2px rgba(0,0,0,.3); margin-bottom: 1rem; } @media screen and (min-width: 30em) { .picture-small { max-width: 20rem; } } .picture-small img { width: 100%; } .picture-tiny { padding-left: 1em; border: thin silver solid; padding: 0.5em; text-align: center; font-style: italic; font-size: 50%; text-indent: 0; margin: .25em; min-width: 4%; max-width: 15%; width: auto; } .picture-tiny img { width: 100%; } .secondary_info { font-size: 83%; } .next_page_button { float: right; } .pagination_list { text-align: center; } .document_format { border: 1px solid #888; padding: .2em; background: #fff99d;} .copyright_info { font-size: 90%; } hr.footnote-separator { width: 80%; margin-left: auto; margin-right: auto; } .doc-footer { font-style: italic; } .doc-footer > *:first-child::before { content: "["; } .doc-footer > *:last-child::after { content: "]"; } /* Resources pages */ div.download-formats { margin-top: 2em; margin-bottom: 2em; } .download-formats p { display: inline; } #mainContent .download-formats ul { display: inline; list-style: none; padding-left: 0; } .download-formats ul li { display: inline; padding-left: 2em; } /* Resources - book styles */ hr.chapter-separator { display: none; } h2.likechapterHead { text-align: center; } h2.chapterHead { text-align: center; } #mainContent ul.author { list-style-type: none; padding-left: 0; } #mainContent div.footnotes { font-style: normal; } /* remove italics */ span.sectionToc { padding-left: 2em; } /* indent TOC properly */ span.subsectionToc { padding-left: 4em; } span.subsubsectionToc { padding-left: 6em;} .js, .js p, .js p.bibitem, .js p.bibitem-p { background-color: #cde7e9; } body.conservancy-Projects #navbar ul li.Projects > a, body.conservancy-news #navbar ul li.news > a, body.conservancy-blog #navbar ul li.blog > a, body.conservancy-About #navbar ul li.About > a, body.conservancy-Compliance #navbar ul li.compliance > a, body.conservancy-donate #navbar ul li.donate > a, body.conservancy-npoacct #navbar ul li.npoacct > a, body.conservancy-sponsors #navbar ul li.sponsors > a /* NO COMMA HERE! */ { border-bottom: 4px solid var(--khaki-green); } #supporters ul { list-style: none; margin: 0; padding: 0; } #supporters li:before { content: ''; display: inline-block; height: 2em; width: 2em; background-image: url(/img/conservancy-supporter-heart.svg); background-size: contain; background-repeat: no-repeat; padding: 0.25em 1.2em 0.25em 0.25em; vertical-align: middle; } #supporters li { padding: 0.5em 2em 1em 2em; margin-left: .25em; list-style: none; } #sponsor ul { clear: all; margin-bottom: 10px; } #sponsor li { width: 100%; float: left; margin-top: 10px; text-align: center; list-style: none; margin-right: 5px; } ul#sponsor li:after { content: ""; display: block; height: 2px; width: 30%; margin-left: 35%; margin-right: 35%; margin-top: 4px; background: #afe478; } #subbox { position: absolute; padding-top: 10px; right: 0px; width: 200px; font-size: 12px; } img.inside-faq { max-width: 100%; width: auto; overflow: scroll; } pre { overflow: auto; } .supporter-type-selector a { font-size: 125%; font-weight: normal; } .supporter-type-selector a.supporter-type-selector-selected { font-size: 127%; font-weight: bold; } /* Make dl's ( such as for FAQ entries) look nice on screens, both big and small. */ dl { border: 3px double #ccc; padding: 0.5em; } dt { text-align: center; margin: 0em 1em 0.5em 0.5em; font-weight: bold; color: green; } dd { margin: 0 0 1.5em 2em; } .fundraiser-top-text { background: #F0FFB8; padding: .2em .7em; } .fundraiser-top-text * { margin: .5em auto; max-width: 70em; width: 95%; } .fundraiser-top-text p { font-size: 110%; font-style: italic; text-align: center; } /* Fallback elements created by conservancy.js when no video source is supported. */ div.small-right, div.medium-right { border: thick solid #577632; padding: .3em; text-align: center; } .breadcrumbs { font-size: 14px; padding: 0.5rem 0 0; } .breadcrumbs, .breadcrumbs a { color: #777; } .breadcrumbs a { padding: 0 0.5em; } .breadcrumbs a:first-child { padding-left: 0; } .breadcrumbs span { padding-left: 0.5em; } .press-release .date, .conservancy-blog .date { margin-bottom: 1rem; } /* Expanding sections. */ details summary { font-size: 1rem; font-weight: bold; padding: 0.5rem 0; }