/*Copyright 2015 Arseny Izotov*/

.content-container[data-preview="yes"] .teammate-container[data-selected="pending"]{
    min-width: 8em;
}

.content-container[data-preview="yes"] h1{
    font-size: 8px;
    margin-left: 9px;
}

.content-container[data-preview="yes"] h2{
    font-size: 6px;
    margin-left: 2px;
}

.content-container[data-preview="yes"] .progress-item{
    width: 51px;
    padding: 4px;
    margin: 4px;
    border-radius: 5px;
}

.content-container[data-preview="yes"]{
    display: block;
    width: 155px;
    font-size: 4px;
    padding: 10px;
    margin: 0;
    z-index: 6;
    opacity: 0;
    overflow: hidden;
}

.content-container[data-preview="yes"][data-it="home"]     { height: 107px; }
.content-container[data-preview="yes"][data-it="progress"] { height: 188px; }
.content-container[data-preview="yes"][data-it="downloads"]{ height: 189px; }
.content-container[data-preview="yes"][data-it="team"]     { height: 236px; }

.content-container[data-preview="yes"] .teammate-container img, .content-container[data-preview="yes"] #downloads-container img{
    width: 47px;
    height: 56px;
    box-shadow: 0px 0px 12px 0px hsla(0, 0%, 0%, .2), 0px 0px 6px 0px hsla(0, 0%, 0%, .2), inset 0px 0px 12px 0px hsla(0, 0%, 0%, .2);
}

.content-container[data-preview="yes"] #downloads-container img.ppt-preview{
    height: 40px;
}

.content-container[data-preview="yes"] .teammate-container, .content-container[data-preview="yes"] #downloads-container a{
    padding: 5px;
    border-radius: 6px;
}

.content-container[data-preview="yes"]{
    animation: preview_fade_in 1000ms, preview_hold 1000ms 1000ms infinite;
}
@keyframes preview_fade_in {
    0%   { opacity: 0;   }
    100% { opacity: .85; }
}
@keyframes preview_hold {
    0%   { opacity: .85; }
    100% { opacity: .85; }
}

#logo[data-playing="yes"] l{ animation: l_color_meld 450ms 2 ease-out alternate, l_color_meld 1250ms 900ms infinite ease-out; }
#logo[data-playing="yes"] e{ animation: e_color_meld 450ms 2 ease-out alternate, e_color_meld 1250ms 900ms infinite ease-out; }
#logo[data-playing="yes"] d{ animation: d_color_meld 450ms 2 ease-out alternate, d_color_meld 1250ms 900ms infinite ease-out; }

#logo{ transition: text-shadow 1s; }
#logo:hover{ text-shadow: 0px 0px 16px blue; }

#logo:hover l{ animation: l_color_meld 1250ms infinite ease-out; }
#logo:hover e{ animation: e_color_meld 1250ms infinite ease-out; }
#logo:hover d{ animation: d_color_meld 1250ms infinite ease-out; }

@keyframes l_color_meld {
    0%   { color: red;   text-shadow: 0px 0px 70px hsla(  0, 100%, 50%, .5); }
    33%  { color: blue;  text-shadow: 0px 0px 70px hsla(180, 100%, 50%, .5); }
    67%  { color: green; text-shadow: 0px 0px 70px hsla( 90, 100%, 50%, .5); }
    100% { color: red;   text-shadow: 0px 0px 70px hsla(  0, 100%, 50%, .5); }
}
@keyframes e_color_meld {
    0%   { color: green; text-shadow: 0px 0px 70px hsla( 90, 100%, 50%, .5); }
    33%  { color: red;   text-shadow: 0px 0px 70px hsla(  0, 100%, 50%, .5); }
    67%  { color: blue;  text-shadow: 0px 0px 70px hsla(180, 100%, 50%, .5); }
    100% { color: green; text-shadow: 0px 0px 70px hsla( 90, 100%, 50%, .5); }
}
@keyframes d_color_meld {
    0%   { color: blue;  text-shadow: 0px 0px 70px hsla(180, 100%, 50%, .5); }
    33%  { color: green; text-shadow: 0px 0px 70px hsla( 90, 100%, 50%, .5); }
    67%  { color: red;   text-shadow: 0px 0px 70px hsla(  0, 100%, 50%, .5); }
    100% { color: blue;  text-shadow: 0px 0px 70px hsla(180, 100%, 50%, .5); }
}