User:Bluemorpho/common.css

/* -- Tabbers -- */

/*general tabber styles*/ .tabber__tabs, .tabber__tab:hover, .tabber__tab--active, .tabber__tabs { box-shadow:none; }

ul.tabbernav, .tabber__header { display: flex; flex-wrap: wrap; justify-content:center; margin: 0; padding: 3px 0; }

ul.tabbernav li { list-style: none; margin: 0; display: inline; }

ul.tabbernav li a, .tabber__tab { padding: 3px 0.5em; margin-left: 3px; border: 1px solid #ccc; border-bottom: none; background: #f2f7ff; text-decoration: none; }

.tabber .tabbertab { padding: 5px; border: 1px solid #ccc; border-top: 0; }

/*specific tabber styles*/ .themedtabber .tabber__panel { padding: 0!important; border:none!important; }

.themedtabber .tabber__header { border-bottom: 2px solid #b39f73!important; padding: 1.0em!important; }

.themedtabber .tabber__tab { background-color: black!important; transition: background-color 0.2s!important; border: 1px solid #b39f73!important; line-height:2em!important; margin: 0 0.2em 0!important; padding: 3px 0.5em!important; border-radius: 0!important; }

.themedtabber .tabber__tab a, .themedtabber .tabber__tab a:hover { color:white!important; }

.themedtabber .tabber__tab:hover, .themedtabber .tabber__tab--active { background-color: #C29C48!important; border: 1px solid #b39f73!important; }

.Heartslabyul .tabber__panel, .Savanaclaw .tabber__panel, .Octavinelle .tabber__panel, .Scarabia .tabber__panel, .Pomefiore .tabber__panel, .Ignihyde .tabber__panel, .Diasomnia .tabber__panel { padding: 5px; width: 100%; box-sizing: border-box; border: 1px solid var(--active-color, initial); }

.Heartslabyul .tabber__header, .Savanaclaw .tabber__header, .Octavinelle .tabber__header, .Scarabia .tabber__header, .Pomefiore .tabber__header, .Ignihyde .tabber__header, .Diasomnia .tabber__header { padding: 1.0em; border-bottom: 2px solid var(--active-color, initial); }

.Heartslabyul .tabber__tab, .Savanaclaw .tabber__tab, .Octavinelle .tabber__tab, .Scarabia .tabber__tab, .Pomefiore .tabber__tab, .Ignihyde .tabber__tab, .Diasomnia .tabber__tab { transition: background-color 0.2s; color: white; background-color: var(--tab-color, initial); border: none; }

.Heartslabyul .tabber__tab:hover, .Savanaclaw .tabber__tab:hover, .Octavinelle .tabber__tab:hover, .Scarabia .tabber__tab:hover, .Pomefiore .tabber__tab:hover, .Ignihyde .tabber__tab:hover, .Diasomnia .tabber__tab:hover { background-color: var(--hover-color, initial); }

.Heartslabyul .tabber__tab--active, .Savanaclaw .tabber__tab--active, .Octavinelle .tabber__tab--active, .Scarabia .tabber__tab--active, .Pomefiore .tabber__tab--active, .Ignihyde .tabber__tab--active, .Diasomnia .tabber__tab--active { background-color: var(--active-color, initial); }

.Heartslabyul .tabber { --tab-color: #d50000; --hover-color: #A51002; --active-color: #8A1305; }

.Savanaclaw .tabber { --tab-color: #F5C663; --hover-color: #ebab1c; --active-color: #EFA406; }

.Octavinelle .tabber { --tab-color: #8A80BB; --hover-color: #A7A0CC; --active-color: #493470; }

.Scarabia .tabber { --tab-color: #9a1719; --hover-color: #7E1402; --active-color: #611710; }

.Pomefiore .tabber { --tab-color: #352687; --hover-color: #7C6E66; --active-color: #241d48; }

.Ignihyde .tabber { --tab-color: #147AEE; --hover-color: #403e43; --active-color: #516EDD; }

.Diasomnia .tabber { --tab-color: #85c02e; --hover-color: #698740; --active-color: #375F00; }

.imgtabber .tabber__panel { padding: 5px 0; border:none; }

.servertab .tabbertab, .servertab .tabber__panel { padding: 20px ; border: none ; } .servertab ul.tabbernav, .servertab .tabber__header { position:sticky; top: 15px; border-bottom: none; } .servertab ul.tabbernav li, .servertab .tabber__tab { height:20px; } .servertab ul.tabbernav li a:link, .servertab .tabber__tab { padding: 10px 10px; background-color: #1C3323; border-radius: 7px; border: none; color: white; } .servertab ul.tabbernav li.tabberactive a, .servertab .tabber__tab:hover, .servertab .tabber__tab--active { background-color: #2E533A; } /**End tabber styles**/

.fc-scroller { height: auto !important; }

.fc-unthemed td.fc-today { background: green; } .fc-widget-header { background: #b39f73; color:black; } /*.fc-content { color:black; }*/

/* CSS for Audio button */

.audio-vil { width: 50px; height: 50px; background-color: transparent; border: none; background-image: url('https://static.miraheze.org/twistedwonderlandwiki/d/d1/Lilia_Music_1.png'); display: inline-block; background-size: 50px auto; filter: grayscale(50%); transition: filter 1s, background-image 1s, } .audio-vil.playing, .audio-vil:hover, .audio-vil-parent:hover > .click-parent { background-color: transparent !important; background-image: url('https://static.miraheze.org/twistedwonderlandwiki/7/71/Lilia_Music_2.png'); background-size: 50px auto; filter: none;} .audio-vil.playing { animation-duration: 3s; animation-name: wiggle; animation-iteration-count: infinite; animation-timing-function: linear; }

@keyframes wiggle { 0% {transform: rotate(0deg);} 25% {transform: rotate(10deg);} 75% {transform: rotate(-20deg);} } .audio-vil.no-audio { background-color: transparent; background-size: 50px auto; background-image: url('https://static.miraheze.org/twistedwonderlandwiki/d/d1/Lilia_Music_1.png'); filter: grayscale(100%); }

.audio-vil>*{ display: none; } /* Audio Button CSS End */