diff --git a/css/mobile.css b/css/mobile.css index cceff5f2..e8db2dc6 100644 --- a/css/mobile.css +++ b/css/mobile.css @@ -1,989 +1,2108 @@ body { - font-size:16px -} - -/* cyrillic */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 300; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-300-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-300-italic.woff) format('woff'); - unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; -} - -/* cyrillic-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 300; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-ext-300-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-ext-300-italic.woff) format('woff'); - unicode-range: U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F; -} - -/* greek */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 300; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-300-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-300-italic.woff) format('woff'); - unicode-range: U+0370-03FF; -} - -/* greek-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 300; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-ext-300-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-ext-300-italic.woff) format('woff'); - unicode-range: U+1F00-1FFF; -} - -/* latin */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 300; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-300-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-300-italic.woff) format('woff'); - unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; -} - -/* latin-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 300; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-ext-300-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-ext-300-italic.woff) format('woff'); - unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF; -} - -/* cyrillic */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 400; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-400-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-400-italic.woff) format('woff'); - unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; -} - -/* cyrillic-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 400; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-ext-400-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-ext-400-italic.woff) format('woff'); - unicode-range: U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F; -} - -/* greek */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 400; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-400-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-400-italic.woff) format('woff'); - unicode-range: U+0370-03FF; -} - -/* greek-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 400; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-ext-400-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-ext-400-italic.woff) format('woff'); - unicode-range: U+1F00-1FFF; -} - -/* latin */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 400; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-400-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-400-italic.woff) format('woff'); - unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; -} - -/* latin-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 400; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-ext-400-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-ext-400-italic.woff) format('woff'); - unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF; -} - -/* cyrillic */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 500; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-500-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-500-italic.woff) format('woff'); - unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; -} - -/* cyrillic-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 500; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-ext-500-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-ext-500-italic.woff) format('woff'); - unicode-range: U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F; -} - -/* greek */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 500; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-500-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-500-italic.woff) format('woff'); - unicode-range: U+0370-03FF; -} - -/* greek-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 500; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-ext-500-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-ext-500-italic.woff) format('woff'); - unicode-range: U+1F00-1FFF; -} - -/* latin */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 500; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-500-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-500-italic.woff) format('woff'); - unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; -} - -/* latin-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 500; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-ext-500-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-ext-500-italic.woff) format('woff'); - unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF; -} - -/* cyrillic */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 700; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-700-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-700-italic.woff) format('woff'); - unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; -} - -/* cyrillic-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 700; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-ext-700-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-ext-700-italic.woff) format('woff'); - unicode-range: U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F; -} - -/* greek */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 700; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-700-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-700-italic.woff) format('woff'); - unicode-range: U+0370-03FF; -} - -/* greek-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 700; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-ext-700-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-ext-700-italic.woff) format('woff'); - unicode-range: U+1F00-1FFF; -} - -/* latin */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 700; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-700-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-700-italic.woff) format('woff'); - unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; -} - -/* latin-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: italic; - font-weight: 700; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-ext-700-italic.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-ext-700-italic.woff) format('woff'); - unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF; -} - -/* cyrillic */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 300; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-300-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-300-normal.woff) format('woff'); - unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; -} - -/* cyrillic-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 300; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-ext-300-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-ext-300-normal.woff) format('woff'); - unicode-range: U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F; -} - -/* greek */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 300; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-300-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-300-normal.woff) format('woff'); - unicode-range: U+0370-03FF; -} - -/* greek-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 300; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-ext-300-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-ext-300-normal.woff) format('woff'); - unicode-range: U+1F00-1FFF; -} - -/* latin */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 300; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-300-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-300-normal.woff) format('woff'); - unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; -} - -/* latin-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 300; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-ext-300-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-ext-300-normal.woff) format('woff'); - unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF; -} - -/* cyrillic */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 400; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-400-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-400-normal.woff) format('woff'); - unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; -} - -/* cyrillic-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 400; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-ext-400-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-ext-400-normal.woff) format('woff'); - unicode-range: U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F; -} - -/* greek */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 400; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-400-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-400-normal.woff) format('woff'); - unicode-range: U+0370-03FF; -} - -/* greek-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 400; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-ext-400-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-ext-400-normal.woff) format('woff'); - unicode-range: U+1F00-1FFF; -} - -/* latin */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 400; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-400-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-400-normal.woff) format('woff'); - unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; -} - -/* latin-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 400; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-ext-400-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-ext-400-normal.woff) format('woff'); - unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF; -} - -/* cyrillic */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 500; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-500-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-500-normal.woff) format('woff'); - unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; -} - -/* cyrillic-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 500; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-ext-500-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-ext-500-normal.woff) format('woff'); - unicode-range: U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F; -} - -/* greek */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 500; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-500-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-500-normal.woff) format('woff'); - unicode-range: U+0370-03FF; -} - -/* greek-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 500; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-ext-500-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-ext-500-normal.woff) format('woff'); - unicode-range: U+1F00-1FFF; -} - -/* latin */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 500; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-500-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-500-normal.woff) format('woff'); - unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; -} - -/* latin-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 500; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-ext-500-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-ext-500-normal.woff) format('woff'); - unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF; -} - -/* cyrillic */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 700; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-700-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-700-normal.woff) format('woff'); - unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; -} - -/* cyrillic-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 700; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-ext-700-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-cyrillic-ext-700-normal.woff) format('woff'); - unicode-range: U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F; -} - -/* greek */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 700; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-700-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-700-normal.woff) format('woff'); - unicode-range: U+0370-03FF; -} - -/* greek-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 700; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-ext-700-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-greek-ext-700-normal.woff) format('woff'); - unicode-range: U+1F00-1FFF; -} - -/* latin */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 700; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-700-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-700-normal.woff) format('woff'); - unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; -} - -/* latin-ext */ -@font-face { - font-family: 'Ubuntu'; - font-style: normal; - font-weight: 700; - src: url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-ext-700-normal.woff2) format('woff2'), url(https://p.poketube.fun/https://fonts.bunny.net/ubuntu/files/ubuntu-latin-ext-700-normal.woff) format('woff'); - unicode-range: U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF; -} - - -::-webkit-scrollbar { - width: 8.5px; - background-color: #36363e; -} - -::-webkit-scrollbar-thumb { - background-color: #7c7c84; - border-radius: 8.75px; -} - -::-webkit-scrollbar-thumb:hover { - background-color: #909098; -} - -p { - color: #fff; -} - -h1 { - font-size: 50px; - margin: 0; - color: #fff; -} - -h5 { - display: block; - font-size: 0.83em; - margin: 1.67em 0; - font-weight: 700; - color: #fff; -} - -a { - color: #007bff; - text-decoration: none; - background-color: transparent; -} - -a:hover { - color: #0056b3; - text-decoration: underline; -} - -a:not([href]) { - color: inherit; - text-decoration: none; -} - -a:not([href]):hover { - color: inherit; - text-decoration: none; -} - -.page-footer-section a, -.page-footer-section p { - color: #b2b4bf; -} - -p { - margin-top: 0; - margin-bottom: 1rem; -} - -p { - display: block; - margin-block-start: 1em; - margin-block-end: 1em; - margin-inline-start: 0; - margin-inline-end: 0; -} - -.mb-3, -.my-3 { - margin-bottom: 1rem !important; -} - -.h5, -h5 { - font-size: 1.3125rem; -} - -.h1, -.h2, -.h3, -.h4, -.h5, -.h6, -h1, -h2, -h3, -h4, -h5, -h6 { - line-height: 1.25; -} - -.h5, -h5 { - font-size: 1.25rem; -} - -.h1, -.h2, -.h3, -.h4, -.h5, -.h6, -h1, -h2, -h3, -h4, -h5, -h6 { - margin-bottom: 0.5rem; - font-weight: 500; - line-height: 1.2; - color: #fff; -} - -.page-footer-section { - position: relative; - padding-top: 100px; - padding-bottom: 20px; - background-color: #f0eef5; -} - -.page-footer-section.bg-dark .caption { - color: rgba(255, 255, 255, 0.6); -} - -.page-footer-section.bg-dark hr { - border-color: #4d4853; -} - -.menu-link { - position: relative; - padding-left: 0; - list-style: none; -} - -.menu-link li { - display: block; - margin: 10px 0; -} - -.mea:hover { - color: #526bf5; - text-decoration: none; -} - -.page-footer-section a, -.page-footer-section p { - color: #b2b4bf; -} - -.page-footer-section a:hover { - color: #526bf5; - text-decoration: none; -} - -.client-img > img { - width: auto; max-width: 100%; - height: auto; - max-height: 100px; + overflow-x: hidden; /* Hide horizontal scrollbar */ + color: #111111; } -.row { - display: flex; - flex-wrap: wrap; - margin-right: -15px; - margin-left: -15px; -} - -.col, -.col-1, -.col-10, -.col-11, -.col-12, -.col-2, -.col-3, -.col-4, -.col-5, -.col-6, -.col-7, -.col-8, -.col-9, -.col-auto, -.col-lg, -.col-lg-1, -.col-lg-10, -.col-lg-11, -.col-lg-12, -.col-lg-2, -.col-lg-3, -.col-lg-4, -.col-lg-5, -.col-lg-6, -.col-lg-7, -.col-lg-8, -.col-lg-9, -.col-lg-auto, -.col-md, -.col-md-1, -.col-md-10, -.col-md-11, -.col-md-12, -.col-md-2, -.col-md-3, -.col-md-4, -.col-md-5, -.col-md-6, -.col-md-7, -.col-md-8, -.col-md-9, -.col-md-auto, -.col-sm, -.col-sm-1, -.col-sm-10, -.col-sm-11, -.col-sm-12, -.col-sm-2, -.col-sm-3, -.col-sm-4, -.col-sm-5, -.col-sm-6, -.col-sm-7, -.col-sm-8, -.col-sm-9, -.col-sm-auto, -.col-xl, -.col-xl-1, -.col-xl-10, -.col-xl-11, -.col-xl-12, -.col-xl-2, -.col-xl-3, -.col-xl-4, -.col-xl-5, -.col-xl-6, -.col-xl-7, -.col-xl-8, -.col-xl-9, -.col-xl-auto { - position: relative; - width: 100%; - padding-right: 15px; - padding-left: 15px; -} - -.fa-icon { - align-items: center; - background-color: transparent; - border: 0; - display: inline-flex; - justify-content: center; - margin: 0; - padding: 0 0.1em; - position: relative; - user-select: none; - vertical-align: text-bottom; - -webkit-user-select: none; -} - -.fa-icon > * { - pointer-events: none; -} - -.fa-icon.disabled, -.fa-icon[disabled] { - color: var(--button-disabled-ink); - fill: var(--button-disabled-ink); - filter: var(--button-disabled-filter); - stroke: var(--button-disabled-ink); - pointer-events: none; -} - -.fa-icon > .fa-icon-badge, -.fa-icon.disabled > .fa-icon-badge { - visibility: hidden; -} - -.fa-icon.fa-icon-badged > .fa-icon-badge { - bottom: -20%; - display: inline-block; - font: 60% sans-serif; - left: calc(100% - 0.2em); - position: absolute; - visibility: visible; -} - -.fa-icon.fa-icon-hflipped > svg { - transform: scale(-1, 1); -} - -.fa-icon.fa-icon-vflipped > svg { - transform: scale(1, -1); -} - -.fa-icon > svg { - height: 1em; - overflow: visible; - width: 1em; -} - -.fa-icon > .fa-icon_bar-chart { - width: calc(1em * 2048 / 1792); -} - -.fa-icon > .fa-icon_cloud-download, -.fa-icon > .fa-icon_cloud-upload, -.fa-icon > .fa-icon_cogs, -.fa-icon > .fa-icon_eraser, -.fa-icon > .fa-icon_film { - width: calc(1em * 1920 / 1792); -} - -.fa-icon > .fa-icon_code { - width: calc(1em * 1830 / 1792); -} - -.fa-icon > .fa-icon_exclamation-triangle { - width: calc(1em * 1794 / 1792); -} - -.fa-icon > .fa-icon_clipboard, -.fa-icon > .fa-icon_comment-alt, -.fa-icon > .fa-icon_external-link, -.fa-icon > .fa-icon_eye-dropper, -.fa-icon > .fa-icon_eye-open, -.fa-icon > .fa-icon_eye-slash, -.fa-icon > .fa-icon_files-o, -.fa-icon > .fa-icon_list-alt { - width: calc(1em * 1792 / 1792); -} - -.fa-icon > .fa-icon_download-alt, -.fa-icon > .fa-icon_font, -.fa-icon > .fa-icon_search, -.fa-icon > .fa-icon_spinner, -.fa-icon > .fa-icon_unlink, -.fa-icon > .fa-icon_upload-alt, -.fa-icon > .fa-icon_zoom-in, -.fa-icon > .fa-icon_zoom-out { - width: calc(1em * 1664 / 1792); -} - -.fa-icon > .fa-icon_home { - width: calc(1em * 1612 / 1792); -} - -.fa-icon > .fa-icon_check { - width: calc(1em * 1550 / 1792); -} - -.fa-icon > .fa-icon_clock-o, -.fa-icon > .fa-icon_cog, -.fa-icon > .fa-icon_floppy-o, -.fa-icon > .fa-icon_info-circle, -.fa-icon > .fa-icon_pause-circle-o, -.fa-icon > .fa-icon_play-circle-o, -.fa-icon > .fa-icon_power-off, -.fa-icon > .fa-icon_question-circle, -.fa-icon > .fa-icon_refresh, -.fa-icon > .fa-icon_save, -.fa-icon > .fa-icon_sliders, -.fa-icon > .fa-icon_undo { - width: calc(1em * 1536 / 1792); -} - -.fa-icon > .fa-icon_arrow-right { - width: calc(1em * 1472 / 1792); -} - -.fa-icon > .fa-icon_filter { - width: calc(1em * 1410 / 1792); -} - -.fa-icon > .fa-icon_plus, -.fa-icon > .fa-icon_trash-o { - width: calc(1em * 1408 / 1792); -} - -.fa-icon > .fa-icon_times { - width: calc(1em * 1188 / 1792); -} - -.fa-icon > .fa-icon_angle-up, -.fa-icon > .fa-icon_double-angle-up, -.fa-icon > .fa-icon_lock, -.fa-icon > .fa-icon_unlock-alt { - width: calc(1em * 1152 / 1792); -} - -.fa-icon > .fa-icon_double-angle-left { - width: calc(1em * 966 / 1792); -} - -.fa-icon > .fa-icon_bolt { - width: calc(1em * 896 / 1792); +html, +body { + overflow-x: hidden; + font-family:ubuntu, sans-serif; } body { - background: #000; + position: relative; } -nav { - font-family: Roboto; - display: flex; - justify-content: space-between; - height: 4em; +* { + font-family:ubuntu, sans-serif; } -nav a { +.animated { + -webkit-animation-duration: 10s; + animation-duration: 10s; + -webkit-animation-fill-mode: both; + animation-fill-mode: both; + animation-iteration-count: infinite; + -moz-animation-iteration-count: infinite; + -webkit-animation-iteration-count: infinite; + -o-animation-iteration-count: infinite; +} + +.v-chip:not(.v-chip--outlined).accent, +.v-chip:not(.v-chip--outlined).error, +.v-chip:not(.v-chip--outlined).info, +.v-chip:not(.v-chip--outlined).primary, +.v-chip:not(.v-chip--outlined).secondary, +.v-chip:not(.v-chip--outlined).success, +.v-chip:not(.v-chip--outlined).warning { color: #fff; +} + +.theme--light.v-chip { + border-color: rgba(0, 0, 0, 0.12); + color: rgba(0, 0, 0, 0.87); +} +.theme--light.v-chip:not(.v-chip--active) { + background: #e0e0e0; +} +.theme--light.v-chip:hover:before { + opacity: 0.04; +} +.theme--light.v-chip--active:before, +.theme--light.v-chip--active:hover:before, +.theme--light.v-chip:focus:before { + opacity: 0.12; +} +.theme--light.v-chip--active:focus:before { + opacity: 0.16; +} +.theme--dark.v-chip { + border-color: hsla(0, 0%, 100%, 0.12); + color: #fff; +} +.theme--dark.v-chip:not(.v-chip--active) { + background: #555; +} +.theme--dark.v-chip:hover:before { + opacity: 0.08; +} +.theme--dark.v-chip--active:before, +.theme--dark.v-chip--active:hover:before, +.theme--dark.v-chip:focus:before { + opacity: 0.24; +} +.theme--dark.v-chip--active:focus:before { + opacity: 0.32; +} +.v-chip { + align-items: center; + cursor: default; + display: inline-flex; + line-height: 20px; + max-width: 100%; + outline: none; + overflow: hidden; + padding: 0 12px; + position: relative; text-decoration: none; - font-weight: 700; + transition-duration: 0.28s; + transition-property: box-shadow, opacity; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + vertical-align: middle; + white-space: nowrap; } - -nav a span { - color: red; +.v-chip:before { + background-color: currentColor; + bottom: 0; + border-radius: inherit; + content: ""; + left: 0; + opacity: 0; + position: absolute; + pointer-events: none; + right: 0; + top: 0; } - -nav .left { - display: flex; - justify-content: flex-start; +.v-chip .v-avatar { + height: 24px !important; + min-width: 24px !important; + width: 24px !important; +} +.v-chip .v-icon { + font-size: 24px; +} +.v-application--is-ltr .v-chip .v-avatar--left, +.v-application--is-ltr .v-chip .v-icon--left { + margin-left: -6px; + margin-right: 6px; +} +.v-application--is-ltr .v-chip .v-avatar--right, +.v-application--is-ltr .v-chip .v-icon--right, +.v-application--is-rtl .v-chip .v-avatar--left, +.v-application--is-rtl .v-chip .v-icon--left { + margin-left: 6px; + margin-right: -6px; +} +.v-application--is-rtl .v-chip .v-avatar--right, +.v-application--is-rtl .v-chip .v-icon--right { + margin-left: -6px; + margin-right: 6px; +} +.v-chip:not(.v-chip--no-color) .v-icon { + color: inherit; +} +.v-chip .v-chip__close.v-icon { + font-size: 18px; + max-height: 18px; + max-width: 18px; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} +.v-application--is-ltr .v-chip .v-chip__close.v-icon.v-icon--right { + margin-right: -4px; +} +.v-application--is-rtl .v-chip .v-chip__close.v-icon.v-icon--right { + margin-left: -4px; +} +.v-chip .v-chip__close.v-icon:active, +.v-chip .v-chip__close.v-icon:focus, +.v-chip .v-chip__close.v-icon:hover { + opacity: 0.72; +} +.v-chip .v-chip__content { align-items: center; - padding-left: 1em; + display: inline-flex; + height: 100%; + max-width: 100%; +} +.v-chip--active .v-icon { + color: inherit; +} +.v-chip--link:before { + transition: opacity 0.3s cubic-bezier(0.25, 0.8, 0.5, 1); +} +.v-chip--link:focus:before { + opacity: 0.32; +} +.v-chip--clickable { + cursor: pointer; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} +.v-chip--clickable:active { + box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), + 0 1px 5px 0 rgba(0, 0, 0, 0.12); +} +.v-chip--disabled { + opacity: 0.4; + pointer-events: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} +.v-chip__filter { + max-width: 24px; +} +.v-chip__filter.v-icon { + color: inherit; +} +.v-chip__filter.expand-x-transition-enter, +.v-chip__filter.expand-x-transition-leave-active { + margin: 0; +} +.v-chip--pill .v-chip__filter { + margin-right: 0 16px 0 0; +} +.v-chip--pill .v-avatar { + height: 32px !important; + width: 32px !important; +} +.v-application--is-ltr .v-chip--pill .v-avatar--left { + margin-left: -12px; +} +.v-application--is-ltr .v-chip--pill .v-avatar--right, +.v-application--is-rtl .v-chip--pill .v-avatar--left { + margin-right: -12px; +} +.v-application--is-rtl .v-chip--pill .v-avatar--right { + margin-left: -12px; +} +.v-chip--label { + border-radius: 4px !important; +} +.v-chip.v-chip--outlined { + border-width: thin; + border-style: solid; +} +.v-chip.v-chip--outlined.v-chip--active:before { + opacity: 0.08; +} +.v-chip.v-chip--outlined .v-icon { + color: inherit; +} +.v-chip.v-chip--outlined.v-chip.v-chip { + background-color: transparent !important; +} +.v-chip.v-chip--selected { + background: transparent; +} +.v-chip.v-chip--selected:after { + opacity: 0.28; +} +.v-chip.v-size--x-small { + border-radius: 8px; + font-size: 10px; + height: 16px; +} +.v-chip.v-size--small { + border-radius: 12px; + font-size: 12px; + height: 24px; +} +.v-chip.v-size--default { + border-radius: 16px; + font-size: 14px; + height: 32px; +} +.v-chip.v-size--large { + border-radius: 27px; + font-size: 16px; + height: 54px; +} +.v-chip.v-size--x-large { + border-radius: 33px; + font-size: 18px; + height: 66px; } -nav .left a { - margin-left: 30px; -} - -nav .left a i { - padding-right: 4px; -} - -nav .middle { +.new-button { + background: #0009; + border-radius: 2em; + padding-right: 1em; display: flex; justify-content: center; align-items: center; + align-content: center; + width: max-content; + margin-top: 4px; + margin-left: 3px; + margin-right: 0; +} +.pill-button { + margin-left: 1em; } -nav .middle .search-bar { - display: flex; - transform: translateY(1em); - background: #222; - border: 1px solid #444; - width: 320px; - height: 30px; +.vertical { + border-left: 1px solid gray; + height: 15px; } -nav .middle button { - display: flex; - transform: translate(22em, -1.25em); - background: #454545; - color: #999; - padding: 10px 10px; - border: 1px; - border-radius: 50%; -} - -nav .middle input { - background: #454545; - color: #999; - padding: 2px 25px; -} - -.search { - display: flex; - flex-direction: row; - justify-content: center; - align-items: center; -} - -.search .search-bar { - display: flex; - transform: translateY(1.5em); - background: #222; - border: 1px solid #444; - width: 320px; - height: 30px; -} - -.search button { - display: flex; - transform: translate(11.5em, -0.75em); - background: #454545; - color: #999; - padding: 10px 10px; - border: 1px; - border-radius: 50%; -} - -.search input { - background: #454545; - color: #999; - padding: 2px 25px; -} - -nav .right { - display: flex; - align-items: center; - padding-right: 1.5em; -} - -nav .right a { - padding-left: 1.5em; -} - -nav .right img { - height: 30px; - width: 30px; - border-radius: 50%; -} - -@font-face { - font-family: "PokeTube Flex"; - src: url("https://p.poketube.fun/https://cdn.glitch.global/43b6691a-c8db-41d4-921c-8cf6aa0d9108/robotoflex.ttf?v=1668343428681"); - font-style: normal; - font-stretch: 1% 800%; - font-weight: 1 1000; - font-display: swap; -} - -.video > .thumbnail > .video-length { - font-size: smaller; - background-color: #0008; - color: #fff; - padding: 2px; - border-radius: 3px; - font-family: PokeTube Flex; - font-stretch: 100%; - font-weight: 600; -} - -@media screen and (min-width: 865px) { - .btn.btn-success { - transform: translate(21em, -1.25em) !important; - /* Old webkit based browsers */ - -webkit-transform: translate(21em, -1.25em) !important; +@-webkit-keyframes wiggle { + 0% { + -webkit-transform: skewX(9deg); + } + 10% { + -webkit-transform: skewX(-8deg); + } + 20% { + -webkit-transform: skewX(7deg); + } + 30% { + -webkit-transform: skewX(-6deg); + } + 40% { + -webkit-transform: skewX(5deg); + } + 50% { + -webkit-transform: skewX(-4deg); + } + 60% { + -webkit-transform: skewX(3deg); + } + 70% { + -webkit-transform: skewX(-2deg); + } + 80% { + -webkit-transform: skewX(1deg); + } + 90% { + -webkit-transform: skewX(0deg); + } + 100% { + -webkit-transform: skewX(0deg); } } -nav .middle .search-bar { - border-radius: 2em !important; - font-family: "poketube flex", sans-serif !important; - font-weight: 850 !important; - font-stretch: extra-expanded !important; +@keyframes wiggle { + 0% { + transform: skewX(9deg); + } + 10% { + transform: skewX(-8deg); + } + 20% { + transform: skewX(7deg); + } + 30% { + transform: skewX(-6deg); + } + 40% { + transform: skewX(5deg); + } + 50% { + transform: skewX(-4deg); + } + 60% { + transform: skewX(3deg); + } + 70% { + transform: skewX(-2deg); + } + 80% { + transform: skewX(1deg); + } + 90% { + transform: skewX(0deg); + } + 100% { + transform: skewX(0deg); + } } +.wiggle { + -webkit-animation-name: wiggle; + animation-name: wiggle; + -webkit-animation-timing-function: ease-in; + animation-timing-function: ease-in; +} + +.animated.wiggle { + -webkit-animation-duration: 0.75s; + animation-duration: 0.75s; +} + +:root { + --text-primary: #fff; + --text-secondary: #fff; + --text-link: #0ab7f0; + + --app-background: #0a0101; + --context-menu-background: #333; + --border-color: #444; + --item-hover-background: #373737; + --item-active-background: #383838; + + --top-bar-background: #202020; + --guide-background: #212121; + + --thumbnail-background: #252525; + + --channel-info-background: #181818; + --channel-contents-background: #0f0f0f; + + /* text */ + --text-link: #0ab7f0 !important; + --text-link-visited: #00c0ff; + --text-color: #ffffff; + --text-font-primary: "PokeTube Flex"; + --text-header-weight: 1000; + + /* Divs */ + --div-gradient: linear-gradient( + 135deg, + #f97794 10%, + #623aa2 100%, + #8e6f7e 100% + ); + --div-border-color: #7c44a0; + --div-prim-bg: #1c1c1c; + --div-second-bg: #1a1a1a; + --div-transparent-bg: #0009; +} + +@font-face { + font-family: "Ginto Nord"; + font-weight: 800; + src: url("https://p.poketube.fun/https://cdn.statically.io/gh/brecert/discord-quote-generator/main/Ginto-Nord-800.woff") + format("woff"); +} + +.alert { + padding: 20px; + background-color: #f44336; + color: white; + opacity: 1; + transition: opacity 0.6s; + margin-bottom: 15px; +} + +.alert.success { + background-color: #04aa6d; +} +.alert.info { + background-color: #2196f3; +} +.alert.warning { + background-color: #ff9800; +} + +.closebtn { + margin-left: 15px; + color: white; + font-weight: bold; + float: right; + font-size: 22px; + line-height: 20px; + cursor: pointer; + transition: 0.3s; +} + +.closebtn:hover { + color: black; +} + +:visited { + color: #00c0ff; +} + +a { + color: #0ab7f0; +} +.fromtheweb-outer { + display: flex; + flex-wrap: wrap; + justify-content: space-between; + -moz-box-pack: justify; + padding: 10px; + margin-bottom: 12px; + border-bottom-right-radius: 10px; + border-bottom-left-radius: 10px; +} +.fromtheweb-inner { + -moz-box-align: center; + text-align: left; + font-size: 14px; + -moz-box-pack: center; + justify-content: center; + padding: 0px 0px; + line-height: 18px; +} + +#desc-container .backtotop { + margin: 0%; + display: none; +} +#desc-container .backtotop a { + margin-top: 0.5em; +} +#desc .close { + display: none; +} +#desc { + font-size: 0.94em; + line-height: 1.2em; + text-align: left; + padding: 0.6em 3%; + margin: 0; + background: #000; + border-top: none; + border-radius: 4px; + height: 100%; +} +#set-language { + margin-bottom: 0.2em; +} +#set-language + p { + display: inline-block; + font-size: 1em; /* 15px */ + margin: 0.45em 0 0; +} + +#descs { + padding: 0.4em 0; +} +#descs p { + margin: 0; + font-weight: 900; + font-stretch: ultra-expanded; + padding: 3px; +} +#descs span { + display: inline-block; + width: 10.5em; + line-height: 2em; +} +#descs span a { + line-height: 1.9em; +} +#descs span.original { + font-weight: bold; +} +/* Display/hide language list */ + +#desc-container { + display: none; +} +#desc-container:target { + display: block; +} +.backtotop b { + display: none; +} + +body { + position: relative; +} + +#desc-container { + position: absolute; + margin-top: -18.9em; + left: 0; + width: 100%; + height: 100%; +} + +#language-container .backtotop a { + position: absolute; + width: 100%; + height: 100%; + background: transparent; + border: none; + margin-top: 0; +} +#desc .close { + float: right; + display: block; +} +#desc .close span { + display: none; +} +#desc .close:after { + content: "\2A09"; + float: right; + position: relative; + bottom: 0.1em; + cursor: pointer; +} + +#descs { + column-width: 10em; + column-count: 3; + column-gap: 0; +} +#descs span { + display: block; +} +#descs span a { + display: inline-block; +} + +#comments-container .backtotop { + margin: 0%; + display: none; +} +#comments-container .backtotop a { + margin-top: 0.5em; +} +#comments .close { + display: none; +} +#comments { + font-size: 0.94em; + line-height: 1.2em; + text-align: left; + padding: 0.6em 3%; + margin: 0; + background: #000; + border-top: none; + border-radius: 4px; + height: 100%; +} +#set-language { + margin-bottom: 0.2em; +} +#set-language + p { + display: inline-block; + font-size: 1em; /* 15px */ + margin: 0.45em 0 0; +} + +#commentss { + padding: 0.4em 0; +} +#commentss p { + margin: 0; + font-weight: 900; + font-stretch: ultra-expanded; + padding: 3px; +} +#commentss span { + display: inline-block; + width: 10.5em; + line-height: 2em; +} +#commentss span a { + line-height: 1.9em; +} +#commentss span.original { + font-weight: bold; +} +/* Display/hide language list */ + +#comments-container { + display: none; +} +#comments-container:target { + display: block; +} + +#rec-cont:target { + display: none; +} +#rec-cont { + display: block; +} + +.backtotop b { + display: none; +} + +body { + position: relative; +} +#comments-container { + position: absolute; + margin-top: -18.9em; + left: 0; + width: 100%; + height: 100%; +} +#language-container .backtotop a { + position: absolute; + width: 100%; + height: 100%; + background: transparent; + border: none; + margin-top: 0; +} +#comments .close { + float: right; + display: block; +} +#comments .close span { + display: none; +} +#comments .close:after { + content: "\2A09"; + float: right; + position: relative; + bottom: 0.1em; + cursor: pointer; +} + +#commentss { + column-width: 10em; + column-count: 3; + column-gap: 0; +} +#commentss span { + display: block; +} +#commentss span a { + display: inline-block; +} + +.description { + white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */ + white-space: -pre-wrap; /* Opera 4-6 */ + white-space: -o-pre-wrap; /* Opera 7 */ + white-space: pre-wrap; /* css-3 */ + word-wrap: break-word; /* Internet Explorer 5.5+ */ + white-space: -webkit-pre-wrap; /* Newer versions of Chrome/Safari*/ + word-break: break-all; + white-space: normal; +} + +.desc { + white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */ + white-space: -pre-wrap; /* Opera 4-6 */ + white-space: -o-pre-wrap; /* Opera 7 */ + white-space: pre-wrap; /* css-3 */ + word-wrap: break-word; /* Internet Explorer 5.5+ */ + white-space: -webkit-pre-wrap; /* Newer versions of Chrome/Safari*/ + word-break: break-all; + white-space: normal; +} + +#more-button-container .backtotop { + margin: 0%; + display: none; +} +#more-button-container .backtotop a { + margin-top: 0.5em; +} +#more-button .close { + display: none; +} +#more-button { + font-size: 0.94em; + line-height: 1.2em; + text-align: left; + padding: 0.6em 3%; + margin: 0; + background: #000; + border-top: none; + border-radius: 4px; + height: 100%; +} +#set-language { + margin-bottom: 0.2em; +} +#set-language + p { + display: inline-block; + font-size: 1em; /* 15px */ + margin: 0.45em 0 0; +} + +#more-buttons { + padding: 0.4em 0; +} +#more-buttons p { + margin: 0; + font-weight: 900; + font-stretch: ultra-expanded; + padding: 3px; +} +#more-buttons span { + display: inline-block; + width: 10.5em; + line-height: 2em; +} +#more-buttons span a { + line-height: 1.9em; +} +#more-buttons span.original { + font-weight: bold; +} +/* Display/hide language list */ + +#more-button-container { + display: none; +} +#more-button-container:target { + display: block; +} + +#rec-cont:target { + display: none; +} +#rec-cont { + display: block; +} + +.backtotop b { + display: none; +} + +body { + position: relative; +} +#more-button-container { + position: absolute; + margin-top: -18.9em; + left: 0; + width: 100%; + height: 100%; +} +#language-container .backtotop a { + position: absolute; + width: 100%; + height: 100%; + background: transparent; + border: none; + margin-top: 0; +} +#more-button .close { + float: right; + display: block; +} +#more-button.close span { + display: none; +} +#more-button .close:after { + content: "\2A09"; + float: right; + position: relative; + bottom: 0.1em; + cursor: pointer; +} + +#more-buttons { + column-width: 10em; + column-count: 3; + column-gap: 0; +} +#more-buttons span { + display: block; +} +#more-buttons span a { + display: inline-block; +} + +.date-publish { +} +/* common stuff */ + +.max-lines-1 { + overflow: hidden; + text-overflow: ellipsis; + display: -webkit-box; + -webkit-line-clamp: 1; + line-clamp: 1; + -webkit-box-orient: vertical; +} + +.max-lines-2 { + overflow: hidden; + text-overflow: ellipsis; + display: -webkit-box; + -webkit-line-clamp: 2; + line-clamp: 2; + -webkit-box-orient: vertical; +} + +/* shared layout */ + +body { + margin: 48px 0; + padding: 0; + font-family: sans-serif; +} + +html { + background-color: var(--app-background); +} + +body.noguide { + grid-template-areas: "top-bar top-bar" "app app"; +} + +* { + box-sizing: border-box; + color: var(--text-secondary); +} + +h1, +h2, +h3, +h4, +h5, +h6 { + color: var(--text-primary); +} + +.top-bar { + position: fixed; + top: 0; + left: 0; + right: 0; + height: 48px; + + display: flex; + align-items: center; + padding: 0 16px; + + box-shadow: #0004 0 2px 5px; + background-color: var(--top-bar-background); + + z-index: 9999; +} + +.top-bar > form { + display: none; +} + +.top-bar > .divider { + flex-grow: 1; +} + +.guide { + position: fixed; + left: 0; + right: 0; + bottom: 0; + height: 48px; + + border-top: 1px solid var(--border-color); + + display: flex; + flex-direction: row; + justify-content: space-around; + + background-color: var(--guide-background); +} + +.top-bar.full-size-search > .logo, +.top-bar.full-size-search > .divider, +.top-bar.full-size-search > .search-button, +.top-bar.full-size-search > .account { + display: none; +} + +.top-bar.full-size-search > form { + height: 40px; + flex-grow: 1; + display: flex !important; +} + +.top-bar.full-size-search > form > input { + box-sizing: border-box; + height: 40px; + border: 1px solid var(--border-color); + border-radius: 0; + color: var(--text-primary); + background-color: var(--item-active-background); +} + +.top-bar.full-size-search > form > input[type="text"] { + flex-grow: 1; +} + +.top-bar.full-size-search > form > input[type="submit"] { + width: 64px; + flex-basis: 64px; +} + +.app { + background-color: var(--app-background); + margin-top: 48px; +} + +a.icon-link, +a.icon-link > i { + width: 32px; + height: 32px; + line-height: 32px; + text-align: center; +} + +.noguide > .guide { + display: none; +} + +/* guide */ + +.guide-item > a { + height: 100%; + padding: 0 24px; + display: flex; + text-align: center; + flex-direction: column; + font-size: x-small; + align-items: center; + text-decoration: none; + justify-content: center; + + color: var(--text-primary); +} + +.guide-item > a > .icon { + width: 24px; + height: 24px; + line-height: 24px; + font-size: initial; + margin-right: 0; +} + +.guide-item:hover { + background-color: var(--item-hover-background); +} + +.guide-item.active { + background-color: var(--item-active-background); +} + +.hide-on-minmode { + display: none; +} + +.show-on-minmode { + display: none; +} + +/* top bar */ + +.logo { + color: var(--text-primary) !important; + text-decoration: none; + font-size: larger; +} + +.account { + width: 48px; + height: 48px; + display: flex; + align-items: center; + justify-content: center; +} + +.account > img { + width: 32px; + height: 32px; +} + +.account-menu { + display: none; +} + +.search-button { + width: 48px; + height: 48px; + display: flex; + align-items: center; + justify-content: center; +} + +/* rich video grid */ + +@media screen and (min-width: 850px) { + .rich-video-grid { + width: 100%; + + display: flex; + flex-wrap: wrap; + gap: 16px 16px; + padding-top: 16px; + justify-content: space-evenly; + } + + .rich-video-grid > .video { + display: grid; + grid-template-columns: 52px 1fr; + grid-template-rows: min-content min-content; + grid-auto-flow: row; + grid-gap: 10px 0; + grid-template-areas: + "thumbnail thumbnail" + "avatar info"; + + margin-bottom: 16px; + width: 400px; + } +} + +@media screen and (max-width: 850px) { + .rich-video-grid { + width: 100%; + } + + .rich-video-grid > .video { + display: grid; + grid-template-columns: 52px 1fr; + grid-template-rows: min-content min-content; + grid-auto-flow: row; + grid-gap: 10px 0; + grid-template-areas: + "thumbnail thumbnail" + "avatar info"; + + margin-bottom: 16px; + } +} + +/* list video item */ + +.video a { + text-decoration: none; + color: #606060; +} + +.video > .thumbnail { + grid-area: thumbnail; + background-color: #ccc; + width: 100%; + height: fit-content; + aspect-ratio: 16 / 9; + + display: flex; + justify-content: flex-end; + align-items: flex-end; + padding: 4px; + + background-position-y: center; + background-size: cover; +} + +.video > .thumbnail.img-thumbnail { + padding: 0 !important; +} + +.video > .thumbnail > img { + object-fit: cover; + width: 100%; + height: 100%; +} + +.video > .thumbnail > span { + font-size: smaller; + + background-color: #0008; + color: #fff; + padding: 2px; + border-radius: 2px; +} + +.video > .avatar { + grid-area: avatar; + width: 36px; + height: 36px; + border-radius: 18px; + background-color: #e3e3e3; + + margin-left: 12px; +} + +.video > .avatar > img { + width: 36px; + height: 36px; + border-radius: 18px; +} + +.video > .info { + grid-area: info; +} + +.video > .info > div { + display: flex; + flex-direction: row; + flex-wrap: wrap; + color: #606060; + column-gap: 8px; + overflow-y: hidden; +} + +.video > .info > .title { + color: var(--text-primary) !important; +} + +/* playlist video item */ + +.playlist-video a { + text-decoration: none; + color: #606060; +} + +.playlist-video > .thumbnail { + grid-area: thumbnail; + background-color: #ccc; + width: 100%; + height: fit-content; + aspect-ratio: 16 / 9; + + display: flex; + justify-content: flex-end; + align-items: flex-end; + padding: 4px; + + background-position-y: center; + background-size: cover; +} + +.playlist-video > .thumbnail > span { + font-size: smaller; + + background-color: #0008; + color: #fff; + padding: 2px; + border-radius: 2px; +} + +.playlist-video > .avatar { + grid-area: avatar; + width: 36px; + height: 36px; + border-radius: 18px; + background-color: #e3e3e3; + + margin-left: 12px; +} + +.playlist-video > .avatar > img { + width: 36px; + height: 36px; + border-radius: 18px; +} + +.playlist-video > .info { + grid-area: info; +} + +.playlist-video > .info > div { + display: flex; + flex-direction: row; + flex-wrap: wrap; + color: #606060; + column-gap: 8px; + overflow-y: hidden; +} + +.playlist-video > .info > .title { + color: var(--text-primary) !important; +} + +.playlist-video > .index { + grid-area: index; + display: none; +} + +.playlist-video > .edit { + grid-area: edit; + display: flex; + justify-content: center; + align-items: center; +} + +/* list playlist item */ + +.playlist a { + text-decoration: none; + color: var(--text-secondary); +} + +.playlist > .thumbnail { + grid-area: thumbnail; + + background-color: #ccc; + + display: flex; + justify-content: flex-end; + align-items: center; + + background-position-y: center; + background-size: cover; +} + +.playlist > .thumbnail > div { + font-size: smaller; + + background-color: #0008; + color: #fff; + padding: 2px; + width: 50%; + height: 100%; + + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + row-gap: 8px; +} + +.playlist > .thumbnail > div > * { + color: #fff; +} + +.playlist > .thumbnail > div > *:nth-child(1) { + font-size: x-large; +} + +.playlist > .info { + grid-area: info; + font-size: small; +} + +.playlist > .info > div > ul { + display: none; +} + +.playlist > .info > .title { + color: var(--text-primary) !important; + font-weight: bold; + font-size: initial; + margin-bottom: 8px; +} + +/* list playlist item */ + +.channel a { + text-decoration: none; + color: var(--text-secondary); +} + +.channel > .avatar { + grid-area: thumbnail; + + display: flex; + justify-content: center; + align-items: center; +} + +.channel > .avatar > img { + background-color: #ccc; + + height: 90px; + width: 90px; +} + +.channel > .info { + grid-area: info; + font-size: small; +} + +.channel > .info > .name { + color: var(--text-primary) !important; + font-weight: bold; + font-size: initial; + margin-bottom: 8px; +} + +.channel > .info p { + display: none; +} + +/* watch page */ + +.watch-page { + display: grid; + grid-template-columns: 1fr 256px; + grid-template-rows: 1fr; + grid-template-areas: "primary secondary"; +} + +@media screen and (max-width: 900px) { + .watch-page { + grid-template-areas: "primary" "secondary"; + grid-template-columns: 1fr; + grid-template-rows: max-content 1fr; + } +} + +.primary { + grid-area: primary; +} + +.video-player-container { + max-width: 100%; + margin: auto; + max-height: 75vh; + aspect-ratio: 16 / 9; + background-color: #000; +} + +.player { + width: 100%; + height: 100%; +} + +.player.error { + display: flex; + align-items: center; + justify-content: center; + background-color: #ccc; + background-image: url("/img/player-error.png") !important; + background-size: contain; +} + +.player.error > * { + background-color: #000; + color: #fff; +} + +.video-info { + padding: 12px; +} + +.video-title { + font-size: large; + color: var(--text-primary); +} + +.video-info-bar { + font-size: small; + display: grid; + grid-auto-columns: 1fr; + grid-template-columns: max-content max-content max-content 1fr max-content; + grid-template-rows: max-content max-content; + gap: 0 8px; + grid-template-areas: + "views . uploaddate divider" + "buttons buttons buttons buttons"; +} + +.video-info-bar > span:nth-child(1) { + grid-area: views; +} + +.video-info-bar > .divider { + grid-area: divider; +} + +.video-info-bar > span:nth-child(3) { + grid-area: uploaddate; +} + +.video-info-bar > .video-info-buttons { + grid-area: buttons; +} + +.video-info-buttons { + display: flex; + justify-content: space-evenly; + flex-direction: row; + column-gap: 8px; + padding: 8px 0; +} + +.video-info-buttons > * { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + column-gap: 4px; + text-decoration: none; +} + +.video-info-buttons > * > i.bi { + font-size: x-large; +} + +.channel-info, +.channel-info__bordered { + display: grid; + grid-template-columns: 34px max-content 1fr min-content; + grid-template-rows: 34px; + grid-auto-columns: 1fr; + gap: 8px; + grid-auto-flow: row; + grid-template-areas: "avatar name . subscribe-button"; + + padding: 8px 0; + + border-top: 1px solid var(--border-color); + border-bottom: 1px solid var(--border-color); +} + +.avatar { + grid-area: avatar; +} + +.avatar > img { + width: 100%; + height: 100%; + border-radius: 50%; +} + +.name { + grid-area: name; + + display: flex; + flex-direction: column; + justify-content: center; +} + +.name > a { + color: var(--text-primary); + text-decoration: none; +} + +.name > span { + font-size: small; + color: var(--text-secondary); +} + +.subscribe-button { + grid-area: subscribe-button; + + background-color: #0000; + color: #c00; + text-transform: uppercase; + border: none; + + height: 100%; +} + +.subscribe-button.subscribed { + color: var(--text-secondary); +} + +.secondary { + grid-area: secondary; + + padding: 16px 8px; +} + +.resolutions-list { + width: 100%; + padding: 4px; + border: 1px solid var(--border-color); + margin-bottom: 16px; +} + +.resolutions-list > div { + display: flex; + flex-direction: column; + column-gap: 16px; +} + +.resolutions-list > div > * { + line-height: 32px; +} + +.recommended-list { + display: flex; + flex-direction: column; + row-gap: 16px; +} + +.recommended-list > .video { + display: grid; + grid-template-columns: 1fr; + grid-template-rows: 1fr max-content; + grid-auto-flow: row; + grid-gap: 0 8px; + grid-template-areas: "thumbnail" "info"; + + color: var(--text-secondary); +} + +.recommended-list > .video > .info { + font-size: small; +} + +.recommended-list > .video > .info > a { + font-size: initial; +} + +.recommended-list > .video > .info > div { + flex-wrap: wrap; + max-height: unset; +} + +/* channel page */ + +.channel-banner { + display: block; + width: 100%; + height: auto; + aspect-ratio: 6.2; + background-color: #000a; + background-size: contain; +} + +.channel-info-container { + background-color: var(--channel-info-background); +} + +.channel-info-container > .channel-info { + grid-template-columns: 50px 1fr; + grid-template-rows: 50px min-content; + grid-template-areas: "avatar name" ". subscribe-button"; + column-gap: 16px; + padding: 16px; +} + +.channel-info-container > .channel-info > .subscribe-button { + width: max-content; +} + +.channel-info-container > .channel-info > .name > *:first-child { + font-size: larger; + color: var(--text-primary); +} + +.channel-info-container > .channel-info > .name > * { + color: var(--text-secondary); +} + +.channel-page > p { + color: var(--text-secondary); +} + +.channel-page .video-grid { + background-color: var(--channel-contents-background); +} + +/* card list item */ + +.card-list { + display: flex; + flex-direction: row; + overflow-x: scroll; + column-gap: 16px; +} + +.card { + width: 150px; + background: var(--context-menu-background); + border: 1px solid var(--border-color); + border-radius: 8px; + text-decoration: none; +} + +.card > img { + aspect-ratio: 16 / 9; + width: 150px; + height: fit-content; +} + +.card > span { + text-decoration: none; + color: var(--text-primary); + margin: 0 8px; +} + +/* channel video "grid" */ + +.video-grid { + display: flex; + flex-direction: column; + flex-wrap: nowrap; + column-gap: 16px; + row-gap: 12px; + padding: 0 12px; +} + +.video-grid > .video { + display: grid; + grid-template-columns: 160px 1fr; + grid-template-rows: 90px; + grid-auto-flow: row; + grid-gap: 10px 10px; + grid-template-areas: "thumbnail info"; + + color: var(--text-secondary); + text-decoration: none; +} + +.video-grid > .avatar { + display: none; +} + +.video-grid > .video > .info > span { + font-weight: bold; + font-size: initial; +} + +.video-grid > .video > .info > div > div { + display: flex; + flex-direction: column; + flex-wrap: wrap; +} + +/* Pagination links */ + +.pagination-buttons { + border-top: 1px solid var(--border-color); + width: 100%; + display: flex; +} + +.pagination-buttons > * { + height: 3rem; + line-height: 3rem; + color: var(--text-secondary); + text-decoration: none; +} + +.pagination-buttons > .divider { + flex-grow: 1; +} + +/* normal video list */ + +.video-list { + margin: auto; + display: flex; + flex-direction: column; + row-gap: 16px; + padding: 16px; +} + +.video-list > .video { + text-decoration: none; + display: grid; + grid-template-columns: 160px; + grid-template-rows: 90px; + grid-auto-flow: row; + grid-gap: 0 16px; + grid-template-areas: "thumbnail info"; + + color: var(--text-secondary); + font-size: small; +} + +.video-list > .playlist-video { + text-decoration: none; + display: grid; + grid-template-columns: 160px 1fr 50px; + grid-template-rows: 90px; + grid-auto-flow: row; + grid-gap: 0 16px; + grid-template-areas: "thumbnail info edit"; + + color: var(--text-secondary); + font-size: small; +} + +.video-list > .video > .info > .title, +.video-list > .playlist-video > .info > .title { + font-weight: bold; +} + +.video-list > .video > .info > div > a > img { + display: none; +} + +.video-list > .playlist { + text-decoration: none; + display: grid; + grid-template-columns: 160px; + grid-template-rows: 90px; + grid-auto-flow: row; + grid-gap: 0 16px; + grid-template-areas: "thumbnail info"; + + color: var(--text-secondary); +} + +.video-list > .channel { + text-decoration: none; + display: grid; + grid-template-columns: 160px 1fr max-content; + grid-template-rows: 90px; + grid-auto-flow: row; + grid-gap: 0 16px; + grid-template-areas: "thumbnail info subscribe-button"; + + color: var(--text-secondary); +} + +.video-list > .channel > .subscribe-button { + display: none; +} + +/* Playlist page */ + +.playlist-info > .thumbnail { + width: 100%; + height: auto; + aspect-ratio: 16 / 9; + background-color: var(--thumbnail-background); + background-size: contain; +} + +.playlist-info > .thumbnail > a { + display: none; +} + +.playlist-info > .title { + font-size: x-large; + color: var(--text-primary); +} + +.playlist-info { + background-color: var(--channel-contents-background); + padding-bottom: 16px; +} + +.playlist-info > .title, +.playlist-info > .info, +.playlist-info > .description { + display: block; + padding: 0 16px; +} + +.playlist-info > .channel-info { + display: none; +} + +/* horizontal channel list */ + +.horizontal-channel-list { + display: flex; + column-gap: 16px; + padding: 16px; + overflow-x: scroll; + background-color: var(--item-hover-background); +} + +.horizontal-channel-list > .channel { + text-decoration: none; + display: flex; + flex-direction: column; + row-gap: 4px; + color: var(--text-secondary); +} + +.horizontal-channel-list > .channel > div { + font-size: small; + text-align: center; + width: 48px; + color: var(--text-secondary); +} + +.horizontal-channel-list > .channel > img { + width: 48px; + height: 48px; + border-radius: 50%; + background-color: var(--thumbnail-background); +} + +.horizontal-channel-list > .channel > i { + font-size: 24px; + line-height: 48px; + text-align: center; + width: 48px; + height: 48px; + border-radius: 50%; + background-color: var(--thumbnail-background); +} + +/* Login / Register / Delete pages */ + +.login-container { + display: flex; + flex-direction: row; + padding: 24px; +} + +@media screen and (max-width: 1300px) { + .login-container { + flex-direction: column; + } +} + +.login-container > * { + flex: 1 1 0; +} + +.login-container > * > div { + max-width: 600px; + margin: auto; +} + +.login-form { + display: flex; + flex-direction: column; + max-width: 400px; + row-gap: 10px; + margin: auto; +} + +.login-form > input, +.login-button { + background-color: var(--item-active-background); + color: var(--text-primary); + border: 1px solid var(--border-color); + padding: 10px; + max-width: 400px; + row-gap: 10px; + margin: auto; +} + +.playlist-form { + display: flex; + flex-direction: column; + max-width: 400px; + row-gap: 10px; + margin: auto; +} + +.playlist-form > input, +.playlist-form > select, +.login-button { + background-color: var(--item-active-background); + color: var(--text-primary); + border: 1px solid var(--border-color); + padding: 10px; + width: 80%; + row-gap: 10px; + margin: auto; +} + +.login-button { + background-color: var(--item-active-background); + color: var(--text-primary); + display: block; + text-align: center; + text-decoration: none; + width: fit-content; +} + +.login-button.danger { + color: red; + font-weight: bold; +} + +.login-form > h1 { + text-align: center; +} + +.login-message { + width: calc(100% - 96px); + margin: 48px; + padding: 16px; + border: 1px solid var(--border-color); + background-color: var(--item-active-background); + border-radius: 5px; +} + +/* Account Menu */ + +.fullscreen-account-menu > .guide-item:hover { + background-color: var(--item-hover-background); +} + +.fullscreen-account-menu > .guide-item > a { + height: 40px; + display: flex; + align-items: start; + color: var(--text-primary); + text-decoration: none; + font-size: initial; + padding: 0; +} + +.fullscreen-account-menu > .guide-item > a > .icon { + height: 24px; + width: 24px; + margin-right: 24px; +} + +.fullscreen-account-menu > .guide-item.active { + background-color: var(--item-active-background); +} + +/* download page */ + +.download-list { + display: flex; + flex-direction: row; + flex-wrap: wrap; + column-gap: 32px; +} + +.download-format { + max-width: 400px; + padding: 8px; + display: flex; + flex-direction: column; + row-gap: 8px; +} + +.download-format > div { + color: var(--text-primary); +} + +.download-format > a { + padding: 8px; + background-color: var(--channel-contents-background); + border: 1px solid var(--border-color); + text-decoration: none; +} + +/* settings page */ + +.settings-categories { + background-color: var(--context-menu-background); + display: flex; + column-gap: 16px; + padding: 0 16px; +} + +.settings-categories > a { + height: 3rem; + line-height: 3rem; + padding: 0 8px; + text-decoration: none; +} + +.settings-content { + max-width: 400px; + margin: auto; +} + +.settings-content > div { + width: 100%; + padding: 8px; +} + +.settings-content > div > label { + width: 45%; + display: inline-block; + font-weight: bold; + color: var(--text-primary); +} + +.settings-content > div > select { + width: 50%; + display: inline-block; + border: 1px solid var(--border-color); + padding: 8px; + background-color: var(--context-menu-background); + color: var(--text-primary); +} + +/* logins page */ + +.logins-container { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: space-evenly; + gap: 16px; + padding: 16px; +} + +.login { + border: 1px solid var(--border-color); + border-radius: 4px; + width: 500px; + padding: 8px; +} + +.subscribe-button > a { + color: black !important; + margin: auto; + margin-right: auto; + background: white; + border-radius: 2em; + text-transform: initial; + font-weight: 900; + padding: 10px 16px; + border: none; + margin-left: 0.5em; + font-family: "PokeTube Flex"; + font-stretch: ultra-expanded; +} + +h3 { + font-stretch: ultra-expanded !important; +} + +.tags { + display: flex; + flex-direction: row; + overflow-x: auto; + column-gap: 3px; +} + +.tag { + background: #333; + padding: 5px; + border-radius: 4px; + word-break: break-all; + white-space: nowrap; +} + +ptd-custom-more { + color: #ffffff; +} + +/* Landscape */ +@media screen and (orientation: landscape) { + .ptnewbuttons { + margin-left: auto; + width: fit-content; + margin-right: auto; + width: -moz-fit-content; + } +} + +.new-button.engagement:hover { + background-color: #0009; +} + +div.new-button:hover { + background-color: #0008; +} + +a.new-button:hover { + background-color: #0008; +}