#header{ height:78px; } #title>img { height:68px; } .item{ height: inherit; } .l-title>h1 { color:#ffcc00; } .l-content>h1 { color:#ff9933; font-size:24px; } .l-content>h2 { color:#cc5200; font-size:22px; } .icode { color:orange; font-family:helvetica; } .scode { padding:15px; margin:0; border:2px solid #337; border-radius:6px; } .ccode { float:right; padding:8px; background:#f19200; color:white; font-family:helvetica; font-size:10pt; border-radius:0 6px ; cursor:pointer; } .author { margin-right:5px; padding:6px; background:#335; border-radius:3px; cursor:pointer; border:#777; text-decoration:none; height:1em; } .author:hover { text-decoration: underline; } .tagoffocial { margin-left:8px; background:#333; padding:3px; padding-left:5px; padding-right:6px; display:inline; font-size:12px; color:#AAA; border-radius:3px; } .license { text-decoration:none; color:white; background:#006600; padding:6px; border-radius:3px; color:whitesmoke; height:1em; } .pb{ margin-top:35px; margin-bottom:35px; border:0; border-top: 5px solid #333; padding:18px; background:#f19200; border-radius:0 0 6px 6px; } #htags{ padding:0; padding-bottom: 25px; padding-top: 120px; display:flex; flex-flow: row wrap; justify-content: flex-start; column-gap:8px; row-gap:8px; } .htag{ padding:8px; background:blue; text-decoration:none; border-radius:16px; color:#DDD; font-size:14px; } .htag:hover{ color:white; } #urls { display:flex; flex-flow: row wrap; justify-content: flex-start; column-gap:8px; row-gap:3px; margin-bottom:35px; } .url { text-decoration:none; padding:12px; background:green; color:#DDD; margin:5px; border-radius:6px; } .url:hover{ color:white; } .lhtags{ margin:0; padding:0; padding-top:120px; margin-bottom: 15px; background:#191820; display:flex; flex-flow: row wrap; justify-content: flex-start; column-gap: 8px; } .lhtag , .hlhtag { padding:8px; text-decoration:none; background:blue; color:#DDD; border-radius:16px; font-size:14px; margin-bottom:5px; } .lhtag:hover { background:orange; color:white; } .hlhtag { background:#ff6600; color:white; } .l-video-caption{ text-align: center; margin-bottom:15px; margin-top:10px; color:orange; } .l-content p , ol, ul{ font-size:16px; width: 65%; } .l-content li{ line-height: 1.2em; height: auto; padding-bottom:1em; } .l-content h1 , h2 { margin-top:1.5em; } .tags{ height:1em; display:flex; flex-flow: row wrap; justify-content: flex-start; column-gap:8px; row-gap:3px; } #topnav { float:right; color:white; height:78px; padding-top:30px; padding-right:15%; overflow-y:auto; scrollbar-width: none; font-size:14pt; font-weight:bold; } #topnav::-webkit-scrollbar{ display: none; } .navbutton { height:68px; font-family:'Roboto', sans-serif; margin-left:50px; color:white; text-decoration:none; padding:0px; } .tab:hover{ border-bottom:3px solid white; } #signup{ padding:15px; background:#9900ff; border-radius:6px; } .dl { background:#0066ff; }@media (max-width: 1024px){ #content, #title>img { margin-left:55px; margin-right:55px; } .l-content p , ol, ul{ font-size:26px; width:100%; margin-right:55px; } .l-content h1 { font-size:34px; } .l-content h2 { font-size:32px; } .l-title h1 { font-size:38px; } .l-outline>img{ max-width:300px; height:300px; object-fit:cover; } .l-outline { height:300px; } .author, .license{ padding:3px; height:1.2em; } .l-outline{ margin-top:35px; } .l-outline>div>p, .author , .license{ font-size:26px; } .l-button-download, .url{ font-size:26px; } .l-content h1 , h2{ margin-top:55px; } .htag,.hlhtag,.lhtag{ padding:12px; border-radius:26px; font-size:26px; margin-right:13px; } .ccode{ font-size:26px; border-radius:6px 6px 0 0 ; float:none; padding-left:35px; } .scode{ padding-top:75px; padding-bottom:75px; overflow-x:scroll; border-radius:0 0 6px 6px; } #topnav{ font-size:26px; padding-right:55px; }.listing { padding-top:55px; grid-template-columns: repeat(auto-fit, 240px); grid-column-gap:55px; } .pic{ height:240px; border-radius:3px; } .caption { font-size:32px; padding:0; } .summary { padding:0; font-size:28px; }