nav { background-color: #ACF3FF !important; }
nav { filter: drop-shadow(-10px 4px 5px rgba(0, 0, 0, 0.15)); }

footer { background-color: #ACF3FF; border-top: 1px solid #74d3e4; }
footer .social-image { filter: drop-shadow(1px 1px 1px rgba(0,0,0,0.3)); }

.uk-text-primary { color: #FCDE00 !important; }
.uk-text-secondary { color: #004793 !important; }

.section-everybody-wins { background-color: #F5AB43; }
.section-everybody-wins .uk-container { background-color: #F5AB43; background-image: url(../common/bg-dotted.jpg); background-size: cover; background-blend-mode: overlay; background-position: center; background-repeat: no-repeat; }

.section-why-become-member { background-color: #27ADD7; }
.section-why-become-member .uk-container { background-color: #27ADD7; background-image: url(../common/bg-dotted.jpg); background-size: cover; background-blend-mode: overlay; background-position: center; background-repeat: no-repeat; }

.section-welcome { color: #fff; background-image: url(../common/blue-tile.jpg); background-size: 20%; background-position: center; background-repeat: repeat; }
.section-welcome .uk-text-secondary { color: #fff !important; }

.uk-button-default { border-color: #004793; color: #004793; }
.uk-button-default:hover { background-color: #fff; color: #004793; filter: drop-shadow(6px 2px 4px rgba(0, 0, 0, 0.25)); }

.uk-button-primary { background-color: #FCDE00; color: #004793; }
.uk-button-primary:hover { background-color: #FCDE00; color: #004793; filter: drop-shadow(6px 2px 4px rgba(0, 0, 0, 0.25)); }

.uk-button-secondary { background-color: #004793; color: #fff; }
.uk-button-secondary:hover { background-color: #004793; color: #fff; filter: drop-shadow(6px 2px 4px rgba(0, 0, 0, 0.25)); }

.tm-colorbook { background-color: #ACF3FF; }
.tm-colorbook .uk-container { background-image: url(./colorbook-bg.png); background-size: auto; background-position: center; background-repeat: no-repeat; background-attachment: fixed; }
.tm-colorbook .book { filter: drop-shadow(10px 0px 3px rgba(0, 0, 0, 0.25)); }

.tm-section-products-friends { background-image: url(../common/red-tile.jpg); background-size: 20%; background-position: center; background-repeat: repeat; }
.tm-section-products-milkey { background-image: url(../common/blue-tile.jpg); background-size: 20%; background-position: center; background-repeat: repeat; }

.tm-section-heroes-top { background-image: url(../common/yellow-tile.jpg); background-size: 20%; background-position: center; background-repeat: repeat; }
.tm-section-heroes-batman { background-color: #064497; }
.tm-section-heroes-batman .tm-heroe { background-image: url(../common/blue-tile.jpg); background-size: 70%; background-position: center; background-repeat: repeat; }
.tm-section-heroes-batman .tm-name { color: #fff;font-weight: 900; text-shadow: 2px 2px 0 red; }
.tm-section-heroes-superman { background-color: #B70430; }
.tm-section-heroes-superman .tm-heroe { background-image: url(../common/red-tile.jpg); background-size: 70%; background-position: center; background-repeat: repeat; }
.tm-section-heroes-superman .tm-name { color: #fff;font-weight: 900; text-shadow: 2px 2px 0 red; }
.tm-section-heroes-wwoman { background-color: #FDE900; }
.tm-section-heroes-wwoman .tm-heroe { background-image: url(../common/yellow-tile.jpg); background-size: 70%; background-position: center; background-repeat: repeat; }
.tm-section-heroes-wwoman .tm-name { color: #fff; font-weight: 900; text-shadow: 2px 2px 0 red; }
.tm-section-heroes-aquaman { background-color: #064497; }
.tm-section-heroes-aquaman .tm-heroe { background-image: url(../common/blue-tile.jpg); background-size: 70%; background-position: center; background-repeat: repeat; }
.tm-section-heroes-aquaman .tm-name { color: #fff; font-weight: 900; text-shadow: 2px 2px 0 red; }
.tm-section-heroes-supergirl { background-color: #B70430; }
.tm-section-heroes-supergirl .tm-heroe { background-image: url(../common/red-tile.jpg); background-size: 70%; background-position: center; background-repeat: repeat; }
.tm-section-heroes-supergirl .tm-name { color: #fff; font-weight: 900; text-shadow: 2px 2px 0 red; }
.tm-section-heroes-flash { background-color: #FDE900; }
.tm-section-heroes-flash .tm-heroe { background-image: url(../common/yellow-tile.jpg); background-size: 70%; background-position: center; background-repeat: repeat; }
.tm-section-heroes-flash .tm-name { color: #fff; font-weight: 900; text-shadow: 2px 2px 0 red; }

.tm-section-news { background-color: #B70430; }
.tm-section-news .uk-container { background-color: #b3212e; background-image: url(../common/bg-dotted.jpg); background-size: cover; background-blend-mode: overlay; background-position: center; background-repeat: no-repeat; }

.tm-section-contests { background-color: #064497; }
.tm-section-contests .uk-container { background-color: #064497; background-image: url(../common/bg-dotted.jpg); background-size: cover; background-blend-mode: overlay; background-position: center; background-repeat: no-repeat; }

.main-menu .uk-navbar-nav a > div { margin-bottom: -10px; }
.main-menu .uk-navbar-nav a .image { display: block; }
.main-menu .uk-navbar-nav a .image img { max-width: 80px; }
.main-menu .uk-navbar-nav a .text { display: block; text-transform: uppercase; color: #064497; font-size: 11px; }

.tm-sticker { cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

.tm-sticker.missing { background-image: url(../common/stickers/empty-sticker.jpg); background-size: cover; border: 1px solid #eee; }
.tm-sticker.missing .tm-sticker-number { font-size: 50px; font-weight: bold; color: #000; }

.tm-sticker.collected { background-size: cover; border: 1px solid #eee; }
.tm-sticker.collected .tm-sticker-number { font-size: 16px; line-height: 30px; border-radius: 50%; font-weight: 900; color: #000; position: absolute; bottom: 10px; right: 10px; border: 2px solid #000; width: 30px; height: 30px; text-align: center; }

.tm-section-album-top { background-image: url(../common/yellow-tile.jpg); background-size: 20%; background-position: center; background-repeat: repeat; }
.tm-section-album-main  { background-color: #acf3ff; min-height: 100vh; background-image: url(/themes/dc/milky/colorbook-bg.png); background-size: auto; background-position: center center; background-repeat: no-repeat; background-attachment: fixed; }
.tm-album-pills { border: 2px solid #fcde00; padding: 10px; border-radius: 10px; background: rgba(255, 255, 255, 0.75); }
.tm-section-album-main .uk-card-default { border: 2px solid #fcde00; padding: 10px; border-radius: 10px; background: rgba(255, 255, 255, 0.75); }
.tm-section-album-main .uk-subnav-pill > li > a { background-color: #F9BF0D; border-radius: 7px; color: #fff; padding: 8px 16px; font-size: 14px; filter: drop-shadow(5px 1px 3px rgba(0, 0, 0, 0.15)); }
.tm-section-album-main .uk-subnav-pill > li > a:hover { filter: drop-shadow(5px 1px 3px rgba(0, 0, 0, 0.35)); }
.tm-section-album-main .uk-subnav-pill > .uk-active > a { background-color: #064497; }
.tm-section-album-main .uk-subnav-pill > .uk-active > a .uk-badge { background-color: #fcde00; color: #000 !important; }
.redeem-sticker-button { position: absolute; top: 0; left: 0; right: 0; bottom: 0; }

.tm-section-profile.tm-album-section .uk-subnav-pill > li > a { cursor: default; background-color: #F9BF0D; border-radius: 7px; color: #000; padding: 8px 16px; font-size: 14px; filter: drop-shadow(3px 0px 1px rgba(0, 0, 0, 0.05)); }
.tm-section-profile.tm-album-section .uk-subnav-pill > .uk-active > a { background-color: #eee; }
.tm-section-profile.tm-album-section .uk-subnav-pill > .uk-active > a .uk-badge { background-color: #fcde00; color: #000 !important; }

.tm-albums-section .tm-album-card .uk-card-header { min-height: auto; padding: 15px; }
.tm-album-card .uk-subnav-pill > li > a { margin: 4px 0; cursor: default; background-color: #F9BF0D; border-radius: 7px; color: #000; padding: 8px 16px; font-size: 14px; filter: drop-shadow(3px 0px 1px rgba(0, 0, 0, 0.05)); }
.tm-album-card .uk-subnav-pill > .uk-active > a { background-color: #eee; }
.tm-album-card .uk-subnav-pill > .uk-active > a .uk-badge { background-color: #fcde00; color: #000 !important; }

.tm-title { background-color: #FCDE00; padding: 10px 18px; border-radius: 10px; color: #005892 !important; font-weight: bold; }
