/*

Digitpaint HTML5 Adventscalendar 2011.

                 ,----.    _,.----.      ,----.         ___                  ,----.                ,-----.--.--, .-.--, ,--.--------. ,--.-,,-,--,
  _,..---._   ,-.--` , \ .' .' -   \  ,-.--` , \ .-._ .'=.'\    _..---.   ,-.--` , \  .-.,.---.   /` ` - /==/  |=| -\==Y==/,  -   , -Y==/  /|=|  |
/==/,   -  \ |==|-  _.-`/==/  ,  ,-' |==|-  _.-`/==/ \|==|  | .' .'.-. \ |==|-  _.-` /==/  `   \  `-'-. -|==|  `-' _|==\==\.-.  - ,-./==|_ ||=|, |
|==|   _   _\|==|   `.-.|==|-   |  . |==|   `.-.|==|,|  / - |/==/- '=' / |==|   `.-.|==|-, .=., |     | `|==\     , |==|`--`\==\- \  |==| ,|/=| _|
|==|  .=.   /==/_ ,    /|==|_   `-' Y==/_ ,    /|==|  \/  , ||==|-,   ' /==/_ ,    /|==|   '='  /     | -|==|`--.  -|==|     \==\_ \ |==|- `-' _ |
|==|,|   | -|==|    .-' |==|   _  , |==|    .-' |==|- ,   _ ||==|  .=. \|==|    .-' |==|- ,   .'      | `|==|    \_ |==|     |==|- | |==|  _     |
|==|  '='   /==|_  ,`-._\==\.       /==|_  ,`-._|==| _ /\   |/==/- '=' ,|==|_  ,`-._|==|_  . ,'.    .-','|==|    |  \==\     |==|, | |==|   .-. ,\
|==|-,   _`//==/ ,     / `-.`.___.-'/==/ ,     //==/  / / , /==|   -   //==/ ,     //==/  /\ ,  )  /     \==\     \ /==/     /==/ -/ /==/, //=/  |
`-.`.____.' `--`-----``             `--`-----`` `--`./  `--``-._`.___,' `--`-----`` `--`-`--`--'   `-----`---`     `--`      `--`--` `--`-' `-`--`

Copyright 2011 by Digitpaint. This code is licensed under the MIT License.

*/

/* ============ */
/* = Plumbing = */
/* ============ */
/* ================ */
/* = Real Marquee = */
/* ================ */
.gopy {
    display: block;
    position: fixed;
    bottom: 0px;
    width: 100%;
    background: #ffe4c4;
    z-index: 100;
    padding: 0px;
    color: #f85d2c;
}
.gopy a {
    color: #ff0000;
    font-weight: bold;
}
        
.marquee{
  max-height: 50px;                
  width: 100%;
  position: relative;
  overflow: hidden;
  white-space: nowrap;                
                
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.marquee.real {
  overflow-x: -webkit-marquee;
  -webkit-marquee-direction: left;
  -webkit-marquee-increment: small;
  -webkit-marquee-repetition: infinite;
  -webkit-marquee-speed: fast;
  -webkit-marquee-style: alternate;
}


/* ================ */
/* = Fake Marquee = */
/* ================ */

/* We need this to float so the dimension will be exactly that of the contents. */
.marquee.fake{
  overflow: hidden;
  position: relative;
  float: left;
}
                    
/* The sliding span */
.marquee.fake span{
  word-wrap: nowrap;                
  display: inline-block;
  position: relative;
                
  -moz-animation-name: marquee;
  -webkit-animation-name: marquee;              

  /* Set the duration, s = seconds */
  -moz-animation-duration: 35s;
  -webkit-animation-duration: 35s;      
  
  /* How many times the animation to repeat */
  -moz-animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;                        

  /* Several options available, use linear for this example */
  -moz-animation-timing-function: linear;
  -webkit-animation-timing-function: linear;     
}
              
/* Stop the marquee on :hover */
.marquee.fake:hover span{
  -webkit-animation-play-state: paused;
  -moz-animation-play-state: paused;
}              
            
@-webkit-keyframes marquee{
  0% {
    left: 100%;
  }
  100% {
    left: -100%;
  }
}
              
@-moz-keyframes marquee{
  0% {
    left: 100%;
  }
  100% {
    left: -100%;
  }
}