@charset "UTF-8";

/* STAR WARS :: GALACTIC EMPIRE :: TITAN XP COLLECTORS EDITION v1.0 :: KALEB WYMAN */

@keyframes flickerAnimation {
    0% { opacity: 1; }
    25% { opacity: 0.95}
    50% { opacity: 0.98; }
    75% { opacity: 0.96; }
    100% { opacity: 1; }
}
@-o-keyframes flickerAnimation{
    0% { opacity: 1; }
    25% { opacity: 0.95}
    50% { opacity: 0.98; }
    75% { opacity: 0.96; }
    100% { opacity: 1; }
}
@-moz-keyframes flickerAnimation{
    0% { opacity: 1; }
    25% { opacity: 0.95}
    50% { opacity: 0.98; }
    75% { opacity: 0.96; }
    100% { opacity: 1; }
}
@-webkit-keyframes flickerAnimation{
    0% { opacity: 1; }
    25% { opacity: 0.95}
    50% { opacity: 0.98; }
    75% { opacity: 0.96; }
    100% { opacity: 1; }
}
.animated-flicker {
    -webkit-animation: flickerAnimation .4s infinite;
    -moz-animation: flickerAnimation .4s infinite;
    -o-animation: flickerAnimation .4s infinite;
    animation: flickerAnimation .4s infinite;
}

/* MICRO BREAKPOINT */

@media only screen and (min-width: 320px) and (max-width: 400px) {
    
    .lightsaber {
        position: absolute;
        width: 80px;
        height: 1708px;
        left: 0px;
        top: 728px;
        float: left;
        overflow: hidden;
        clip: rect(0px, 80px, 1390px, 0px);
        z-index: 99;
        /*background-color: rgba(255,0,0,0.4);*/
    }

    .hilt {
        position: absolute;
        width: 80px;
        height: 1408px;
        background: url('/content/dam/en-zz/Solutions/geforce/titan-xp-collectors-edition/lightsabers/images/darth-vader-rotj-lightsaber-hilt-x-m.png') no-repeat;
        background-position: center top;
        background-size: contain;
        left: -40px;
        top: -1050px;
        cursor: pointer;
    }
    
    .masker {
        position: relative;
        width: 80px;
        height: 500px;
        left: 0px;
        top: 1373px;
        background-color: #000;
    }

    .blade {
        position: absolute;
        width: 80px;
        height: 1408px;
        background: url('/content/dam/en-zz/Solutions/geforce/titan-xp-collectors-edition/lightsabers/images/darth-vader-rotj-lightsaber-light-x-m.png') no-repeat;
        left: -40px;
        top: 2408px;
        clip: rect(0px, 80px, 1300px, 0px);
        opacity: 0;
    }
    
}

/* MOBILE BREAKPOINT */

@media only screen and (min-width: 401px) and (max-width: 767px) {

    .lightsaber {
        position: absolute;
        width: 80px;
        height: 1708px;
        left: 0px;
        top: 728px;
        float: left;
        overflow: hidden;
        clip: rect(0px, 80px, 1390px, 0px);
        z-index: 99;
        /*background-color: rgba(255,0,0,0.4);*/
    }

    .hilt {
        position: absolute;
        width: 80px;
        height: 1408px;
        background: url('/content/dam/en-zz/Solutions/geforce/titan-xp-collectors-edition/lightsabers/images/darth-vader-rotj-lightsaber-hilt-x-m.png') no-repeat;
        background-position: center top;
        background-size: contain;
        left: 0px;
        top: -1050px;
        cursor: pointer;
    }
    
    .masker {
        position: relative;
        width: 80px;
        height: 500px;
        left: 0px;
        top: 1373px;
        background-color: #000;
    }

    .blade {
        position: absolute;
        width: 80px;
        height: 1408px;
        background: url('/content/dam/en-zz/Solutions/geforce/titan-xp-collectors-edition/lightsabers/images/darth-vader-rotj-lightsaber-light-x-m.png') no-repeat;
        left: 0px;
        top: 2408px;
        clip: rect(0px, 80px, 1300px, 0px);
        opacity: 0;
    }

}

/* TABLET BREAKPOINT */

@media only screen and (min-width: 768px) and (max-width: 1024px) {

	.lightsaber {
        position: absolute;
        width: 148px;
        height: 1520px;
        left: 0px;
        top: 641px;
        float: left;
        overflow: hidden;
        clip: rect(0px, 130px, 1360px, 0px);
        z-index: 99;
        /*background-color: rgba(255,0,0,0.4);*/
    }

    .hilt {
        position: absolute;
        width: 148px;
        height: 1432px;
        background: url('/content/dam/en-zz/Solutions/geforce/titan-xp-collectors-edition/lightsabers/images/darth-vader-rotj-lightsaber-hilt-x-dt.png') no-repeat;
        left: -10px;
        top: -850px;
        cursor: pointer;
    }
    
    .masker {
        position: relative;
        width: 148px;
        height: 230px;
        left: 0px;
        top: 1400px;
        background-color: #000;
    }

    .blade {
        position: absolute;
        width: 148px;
        height: 1432px;
        background: url('/content/dam/en-zz/Solutions/geforce/titan-xp-collectors-edition/lightsabers/images/darth-vader-rotj-lightsaber-light-x-dt.png') no-repeat;
        left: -10px;
        top: 2800px;
        clip: rect(0px, 148px, 1180px, 0px);
        opacity: 0;
    }

}

/* DESKTOP BREAKPOINT */

@media only screen and (min-width: 1025px) and (max-width: 1280px) {

	.lightsaber {
        position: absolute;
        width: 148px;
        height: 1540px;
        left: 0px;
        top: 862px;
        float: left;
        overflow: hidden;
        clip: rect(0px, 130px, 1380px, 0px);
        z-index: 99;
        /*background-color: rgba(255,0,0,0.4);*/
    }

    .hilt {
        position: absolute;
        width: 148px;
        height: 1432px;
        background: url('/content/dam/en-zz/Solutions/geforce/titan-xp-collectors-edition/lightsabers/images/darth-vader-rotj-lightsaber-hilt-x-dt.png') no-repeat;
        left: -10px;
        top: -840px;
        cursor: pointer;
    }
    
    .masker {
        position: relative;
        width: 148px;
        height: 230px;
        left: 0px;
        top: 1400px;
        background-color: #000;
    }

    .blade {
        position: absolute;
        width: 148px;
        height: 1432px;
        background: url('/content/dam/en-zz/Solutions/geforce/titan-xp-collectors-edition/lightsabers/images/darth-vader-rotj-lightsaber-light-x-dt.png') no-repeat;
        left: -10px;
        top: 2320px;
        clip: rect(0px, 148px, 1432px, 0px);
        opacity: 0;
    }

}

/* SUPER DESKTOP BREAKPOINT */

@media only screen and (min-width: 1281px) {

    .lightsaber {
        position: absolute;
        width: 226px;
        height: 1790px;
        margin: 0px 0px 0px -866px;
        left: 50%;
        top: 878px; /* MIGHT VARY IN LIVE ENV */
        float: left;
        overflow: hidden;
        clip: rect(0px, 226px, 1540px, 0px);
        /*background-color: rgba(255,0,0,0.4);*/
        z-index: 2;
    }

    .hilt {
        position: absolute;
        width: 226px;
        height: 1380px;
        background: url('/content/dam/en-zz/Solutions/geforce/titan-xp-collectors-edition/lightsabers/images/darth-vader-rotj-lightsaber-hilt-x-u.png') no-repeat;
        top: -620px;
        bottom: 1005px;
        cursor: pointer;
    }
    
    .masker {
        position: relative;
        width: 226px;
        height: 430px;
        left: 0px;
        top: 1373px;
        background-color: #000;
    }

    .blade {
        position: absolute;
        width: 226px;
        height: 1380px;
        background: url('/content/dam/en-zz/Solutions/geforce/titan-xp-collectors-edition/lightsabers/images/darth-vader-rotj-lightsaber-light-x-u.png') no-repeat;
        left: 0px;
        top: 2380px;
        opacity: 0;
    }

}