#priemka { width: 238px; height: 475px; background: url('http://i.imgur.com/oZkNfmP.png'); margin: 0 auto; position: relative;}

.piixback { width: 208px; height: 368px; background-color: #F9F9F9; position: absolute; left: 13px; top: 56px;}

.piixbar { background-color: #d4c4db; width: 198px; height: 15px; padding: 5px;}

.piixbarsig { color: #fff; font-size: 7px; }

.piixtop { width: 208px; height: 75px; position: absolute; top: 0px; left: 0px; }

.piixtopn { font-family: 'roboto', sans-serif; font-weight: 900; font-size: 20px; letter-spacing: -1px; line-height: 100%; color: #fff; text-align: center; width: 212px; height: 10px; padding: 10px 10px 5px 0px;}

.piixtopf { font-family: 'roboto', sans-serif; font-weight: 400; letter-spacing: 1px; font-size: 9px; color: #fff; text-align: center; width: 208px; text-transform: uppercase;}

.piixmessage { font-family: 'roboto', sans-serif; font-weight; 300; color: #333; font-size: 9px; letter-spacing: 0px; line-height: 110%; margin-top: 10px; margin-left: 65px;}

.piixholds { width: 200px; height: 205px; position: absolute; top: 85px; overflow-y: auto; overflow-x: hidden; padding-right: 8px;}

.piixmessage p { position: relative; width: 80px; padding: 15px; background: #FFFFFF; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px;}

.piixmessage p:after { content: ''; position: absolute; border-style: solid; border-width: 10px 0 10px 15px; border-color: transparent #FFFFFF; display: block; width: 0; z-index: 1; margin-top: -10px; right: -15px; top: 44%; }

.piixbottom { width: 208px; height: 80px; position: absolute; top: 290px; left: 0px; }

.piixbottomn { font-family: 'roboto', sans-serif; font-weight: 900; font-size: 20px; letter-spacing: -1px; line-height: 110%; color: #fff; text-align: center; width: 212px; height: 20px; position: absolute; left: 30px; top: 20px;}

.piixbottomb { width: 108px; background-color: #fff; height: 1px; font-size: 8px; font-family: 'roboto', sans-serif; letter-spacing: 1px; color: #000; height: 15px; line-height: 15px; padding-left: 5px;position: absolute; left: 80px; top: 45px; font-style: italic;}
   
.piixtopen a:link, .piixtopen a:visited, .piixtopen a:active, .piixtopen a:hover { color: #fff; }

.piixtopen{
 animation: animationFrames linear 3s;
 animation-iteration-count: infinite;
 transform-origin: 50% 50%;
 -webkit-animation: animationFrames linear 3s;
 -webkit-animation-iteration-count: infinite;
 -webkit-transform-origin: 50% 50%;
 -moz-animation: animationFrames linear 3s;
 -moz-animation-iteration-count: infinite;
 -moz-transform-origin: 50% 50%;
 -o-animation: animationFrames linear 3s;
 -o-animation-iteration-count: infinite;
 -o-transform-origin: 50% 50%;
 -ms-animation: animationFrames linear 3s;
 -ms-animation-iteration-count: infinite;
 -ms-transform-origin: 50% 50%;
 color: #fff; font-size: 20px;
 position: absolute; top: 35px; left: 20px;
}

@keyframes animationFrames{
 0% {
   transform:  translate(0px,0px) ;
 }
 10% {
   transform:  translate(0px,0px) ;
 }
 20% {
   transform:  translate(0px,0px) ;
 }
 30% {
   transform:  translate(-3px,0px) ;
 }
 40% {
   transform:  translate(3px,0px) ;
 }
 50% {
   transform:  translate(-3px,0px) ;
 }
 60% {
   transform:  translate(3px,0px) ;
 }
 70% {
   transform:  translate(-3px,0px) ;
 }
 80% {
   transform:  translate(3px,0px) ;
 }
 90% {
   transform:  translate(-3px,0px) ;
 }
 100% {
   transform:  translate(0px,0px) ;
 }
}

@-moz-keyframes animationFrames{
 0% {
   -moz-transform:  translate(0px,0px) ;
 }
 10% {
   -moz-transform:  translate(-3px,0px) ;
 }
 20% {
   -moz-transform:  translate(3px,0px) ;
 }
 30% {
   -moz-transform:  translate(-3px,0px) ;
 }
 40% {
   -moz-transform:  translate(3px,0px) ;
 }
 50% {
   -moz-transform:  translate(-3px,0px) ;
 }
 60% {
   -moz-transform:  translate(3px,0px) ;
 }
 70% {
   -moz-transform:  translate(-3px,0px) ;
 }
 80% {
   -moz-transform:  translate(3px,0px) ;
 }
 90% {
   -moz-transform:  translate(-3px,0px) ;
 }
 100% {
   -moz-transform:  translate(0px,0px) ;
 }
}

@-webkit-keyframes animationFrames {
 0% {
   -webkit-transform:  translate(0px,0px) ;
 }
 10% {
   -webkit-transform:  translate(-3px,0px) ;
 }
 20% {
   -webkit-transform:  translate(3px,0px) ;
 }
 30% {
   -webkit-transform:  translate(-3px,0px) ;
 }
 40% {
   -webkit-transform:  translate(3px,0px) ;
 }
 50% {
   -webkit-transform:  translate(-3px,0px) ;
 }
 60% {
   -webkit-transform:  translate(3px,0px) ;
 }
 70% {
   -webkit-transform:  translate(-3px,0px) ;
 }
 80% {
   -webkit-transform:  translate(3px,0px) ;
 }
 90% {
   -webkit-transform:  translate(-3px,0px) ;
 }
 100% {
   -webkit-transform:  translate(0px,0px) ;
 }
}

@-o-keyframes animationFrames {
 0% {
   -o-transform:  translate(0px,0px) ;
 }
 10% {
   -o-transform:  translate(-3px,0px) ;
 }
 20% {
   -o-transform:  translate(3px,0px) ;
 }
 30% {
   -o-transform:  translate(-3px,0px) ;
 }
 40% {
   -o-transform:  translate(3px,0px) ;
 }
 50% {
   -o-transform:  translate(-3px,0px) ;
 }
 60% {
   -o-transform:  translate(3px,0px) ;
 }
 70% {
   -o-transform:  translate(-3px,0px) ;
 }
 80% {
   -o-transform:  translate(3px,0px) ;
 }
 90% {
   -o-transform:  translate(-3px,0px) ;
 }
 100% {
   -o-transform:  translate(0px,0px) ;
 }
}

@-ms-keyframes animationFrames {
 0% {
   -ms-transform:  translate(0px,0px) ;
 }
 10% {
   -ms-transform:  translate(-3px,0px) ;
 }
 20% {
   -ms-transform:  translate(3px,0px) ;
 }
 30% {
   -ms-transform:  translate(-3px,0px) ;
 }
 40% {
   -ms-transform:  translate(3px,0px) ;
 }
 50% {
   -ms-transform:  translate(-3px,0px) ;
 }
 60% {
   -ms-transform:  translate(3px,0px) ;
 }
 70% {
   -ms-transform:  translate(-3px,0px) ;
 }
 80% {
   -ms-transform:  translate(3px,0px) ;
 }
 90% {
   -ms-transform:  translate(-3px,0px) ;
 }
 100% {
   -ms-transform:  translate(0px,0px) ;
 }
}

