#banner {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        -webkit-font-smoothing: antialiased !important;
        text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004);
        width: 160px;
        height: 600px;
        position: absolute;
        cursor: pointer;
        overflow: hidden;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        margin: auto;
        top: 0px;
        bottom: 0px;
        left: 0px;
        right: 0px;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        border: 1px solid #000;
        opacity: 1;
        background-color: #fff;
    }
    
    .copy {
        font-size: 28px;
        line-height: 30px;
        /*font-weight:bold;*/
        letter-spacing: 0px;
        font-weight: 500;
    }
    
    #banner img,
    #banner div {
        border: none;
        position: absolute;
        opacity: 1;
        font-family: HelveticaLight, Helvetica, Arial, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Segoe UI, InfoText, Calibiri, Arial Unicode MS;
        font-weight: normal;
        /*font-family: "Arial", sans-serif;
        font-weight: bold;*/
        text-align: right;
    }
    
    #banner #BackgroundImage {
        background-image: url('assets/background.jpg');
        border: none;
        opacity: 1;
        width: 100%;
        height: 100%;
        right: 0px;
    }
    
    #banner #FrameOne {
        border: none;
        opacity: 1;
        width: 160px;
        height: 100%;
        right: 0px;
    }
    
    #banner #FrameOne #printerBottom {
        display: block;
        border: none;
        position: absolute;
        background-image: url(assets/printer_bottom.png);
        opacity: 1;
        width: 180px;
        height: 137px;
        left: 12px;
        top: 175px;
    }
    
    #banner #FrameTwoImageMask {
        overflow: hidden;
        top: 235px;
        height: 500px;
        width: 300px;
    }
    
    #banner #FrameTwoImageMask #FrameTwoImage {
        background: url(assets/RIBBON.jpg) -0px 0px;
        opacity: 1;
        width: 78px;
        height: 1003px;
        top: -10px;
        left: 29px;
    }
    
    #banner #FrameOneImage {
        display: block;
        border: none;
        position: absolute;
        background: url(assets/spritesheet5.png) 0px 0px;
        position: 0px 0px;
        opacity: 1;
        width: 141px;
        height: 122px;
        right: -32px;
        bottom: 0px;
        
       -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        
        animation: play 1s steps(26) forwards;
        -webkit-animation: play 1s steps(26) forwards;
        -ms-animation: play 1s steps(26) forwards;
        -moz-animation: play 1s steps(26) forwards;
        
        -webkit-animation-iteration-count: 1;
        animation-iteration-count: 1;
        -ms-animation-iteration-count: 1;
        -moz-animation-iteration-count: 1;
        
        -webkit-animation-duration: 3.5s;
        animation-duration: 3.5s;
        -ms-animation-duration: 3.5s;
        -moz-animation-duration: 3.5s;
        
        -webkit-animation-delay: 2s;
        animation-delay: 2s;
        -ms-animation-delay: 2s;
        -moz-animation-delay: 2s;
        
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
        -ms-transition-timing-function: ease-in;
        -moz-transition-timing-function: ease-in;
    }

    @keyframes play {
        from {
            background-position: 0;
        }
        to {
            background-position: -3666px;
        }
    }
    @-webkit-keyframes play {
        from {
            background-position: 0;
        }
        to {
            background-position: -3666px;
        }
    }
    @-moz-keyframes play {
        from {
            background-position: 0;
        }
        to {
            background-position: -3666px;
        }
    }
        @-ms-keyframes play {
        from {
            background-position: 0;
        }
        to {
            background-position: -3666px;
        }
    }






    #banner #FrameOne #printer {
        display: block;
        border: none;
        position: absolute;
        background-image: url(assets/printer.png);
        opacity: 1;
        width: 180px;
        height: 137px;
        left: 12px;
        top: 175px;
    }
    
    #banner #FrameOne #copyOne,
    #banner #FrameOne #copyTwo {
        line-height: 28px;
        text-align: center;
        color: #10218b;
        position: absolute;
        left: 0px;
        top: 70px;
        width: 100%;
        opacity: 0;
    }
    
    #banner #FrameOne #copyTwo,
    #banner #FrameOne #copyThree {
        line-height: 28px;
        text-align: center;
        color: #10218b;
        position: absolute;
        left: 0px;
        top: 85px;
        width: 100%;
        opacity: 0;
    }
    
    #banner #FrameOne #copyFour {
        font-size: 18px;
        line-height: 20px;
        text-align: center;
        color: #10218b;
        position: absolute;
        left: 0px;
        top: 30px;
        width: 100%;
        opacity: 0;
    }
    
    #banner #epsonLogo {
        position: absolute;
        bottom: 0px;
        right: 0px;
        z-index: 9999;
        opacity: 1;
    }
    
    #banner #cta {
        font-weight: bold;
        background-color: #10218b;
        font-size: 12px;
        line-height: 18px;
        text-align: center;
        color: #fff;
        position: absolute;
        padding-top: 11px;
        height: 29px;
        left:12px;
        top: 108px;
        width: 134px;
        opacity: 0;
    }
    
    #banner #bgexit {
        opacity: 1;
        cursor: pointer;
        z-index: 2101;
        width: 100%;
        height: 100%;
    }