*, ::after, ::before { box-sizing: border-box } .row { margin-right: calc(-0.5 * var(--bs-gutter-x)); margin-left: calc(-0.5 * var(--bs-gutter-x)); } .row>* { padding-right: calc(1.5rem * 0.5); padding-left: calc(1.5rem * 0.5); } body { color: #212529; font-weight: 400; background-color: #ddd; -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: #fff0; } .header { color: #212529; background-color: #fff; transition: all 0.5s; z-index: 3; position: relative; align-items: center; } .header-01 { position: relative; align-items: center; justify-content: space-between; width: 100%; padding-right: calc(var(--cb-gutter-x) * 0.5); padding-left: calc(var(--cb-gutter-x) * 0.5); margin-right: auto; margin-left: auto; } .site-logo { align-items: center; text-decoration: none; } .site-logo img { vertical-align: middle; margin-right: 8px; } .site-logo h1 { font-weight: 700; color: #101f0c; } .site-logo h1 span { color: #24bd00; } .album-data { background: #262626; } .form_search .form-input { text-indent: 33px; border-radius: 10px; font-weight: 600; opacity: .8; border: solid 1px #aaa; } .intro { position: relative; z-index: 2; } .intro p { color: color-mix(in srgb, #212529, transparent 40%); font-weight: 400; } .intro h2 { font-weight: 700; } .intro h3 { font-weight: 500; } .intro h3 img { vertical-align: middle; } .containRelated .related-item { background: #fffb8d9e; } section, .section { color: #212529; background-color: #f1f6f1; overflow: clip; } .navmenu { position: relative; } .navmenu li ul { min-width: 160px; background-color: #fff; box-shadow: 0 8px 16px 0 rgb(0 0 0 / .2); z-index: 1; border-radius: 5px; } .hideUnfilled .adsbygoogle[data-ad-status="unfilled"] { display: none !important; } .dropdown ul { list-style-type: none; } .dropdown li { text-align: left } .dropdown li a:hover { background-color: #ddd } .navmenu li ul.show { display: block } .navmenu a { text-decoration: none } .container-album { text-align: center; background: #e7fffd; } .album-data { background: #262626; } .album-data img { max-width: 500px; height: 300px; } .ytPlay { color: #cf0000; text-decoration: none; font-weight: 700; } .ytPlay img { vertical-align: middle; width: 45px; } .article { background: #fff; color: #45623d; } .article small { cursor: default; border-radius: 5px; transition: 0.5s; vertical-align: middle; } .article small u { text-decoration: none; font-weight: 700 } .article span { letter-spacing: .3px; line-height: 1.3em; margin-top: -7px; font-size: 15px; color: #0087e7; font-weight: 700; font-family: monospace; padding: 0 5px 0 5px; margin-left: -5px; background-color: rgb(138 195 229 / 19%); } .article p { color: #a7a7a7; } #thisPost p b { font-weight: 300; } #modeIMG button { background: #6c6c6c; color: #fff; border-radius: 5px; } #modeIMG button:hover { background: #2c2c2c } #modeIMG button:disabled { cursor: move; background: #343434 } #modeIMG button:hover:disabled { background: #343434 } .toolContainer { background-color: #a0f5f9; border: solid 1px #c1c1c1; top: 100px; right: 0; cursor: move; z-index: 1; padding: 20px; max-width: 550px; text-align: center; } #chordku.piano div { color: black !important; font-weight: 700; background-position: bottom; } .crdQ { color: transparent !important; border-radius: 4px; text-align: center; background: #fff; background-repeat: no-repeat; background-position: center; } .no-drag { cursor: pointer } .fw-bolder { font-weight: bolder !important } #crdVersion { display: inline-block } #crdVersion select { text-align: center; text-align-last: center; background: #181818; color: #fff; border-radius: 8px; } #crdVersion option:checked { background: #004a2c } .closeTool { font-size: 14px; right: 2px; top: 2px; border: solid 1px #aaa; background: #000; color: #fff; border-radius: 0 0 0 15px; padding: 0 5px 5px 5px; } #related { background-image: linear-gradient(#fff, #f3f3f3); z-index: 3; position: relative } .related .related-item { position: relative; box-shadow: 0 5px 90px 0 rgb(0 0 0 / .1); transition: all ease-in-out 0.3s; border-radius: 18px; } .related .related-item:hover { transform: translateY(-10px); border-color: var(--accent-color) } .related-item h3 { font-weight: 700; transition: ease-in-out 0.3s; } .related-item a { color: #000; text-decoration: none } .viewer { font-size: 11px !important; top: -25px; right: 0; border: solid 1px #aaa; padding: 0 8px; border-radius: 10px 0; background: #7e9595; color: #fff; } .viewer img { vertical-align: middle; filter: invert(100%) brightness(100%) } #related .keys { color: #0b8503; } .related-title { text-align: center; position: relative; color: #101f0c; font-weight: 700; } .related .description-title { color: #71c55d } #footer { background: #dddddd; z-index: 3; position: relative; text-align: center; } .navmenu ul { list-style: none; align-items: center; } .navmenu li { position: relative } .navmenu a, .navmenu a:focus { color: #212529; font-weight: 400; }