@charset "UTF-8";

/* STAR WARS :: JEDI ORDER :: TITAN XP COLLECTORS EDITION v1.2 :: 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, 40px, 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/luke-skywalker-rotj-lightsaber-hilt-x-m.png) no-repeat;
        background-position: center top;
        background-size: contain;
        left: -40px;
        top: -978px;
        cursor: pointer;
    }
    
    .masker {
        position: relative;
        width: 80px;
        height: 500px;
        left: 0px;
        top: 1403px;
        background-color: #000;
    }

    .blade {
        position: absolute;
        width: 80px;
        height: 1408px;
        background: url('/content/dam/en-zz/Solutions/geforce/titan-xp-collectors-edition/lightsabers/images/luke-skywalker-rotj-lightsaber-light-m.jpg') no-repeat;
        left: -40px;
        top: 1408px;
        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/luke-skywalker-rotj-lightsaber-hilt-x-m.png) no-repeat;
        background-position: center top;
        background-size: contain;
        left: 0px;
        top: -978px;
        cursor: pointer;
    }
    
    .masker {
        position: relative;
        width: 80px;
        height: 500px;
        left: 0px;
        top: 1403px;
        background-color: #000;
    }

    .blade {
        position: absolute;
        width: 80px;
        height: 1408px;
        background: url('/content/dam/en-zz/Solutions/geforce/titan-xp-collectors-edition/lightsabers/images/luke-skywalker-rotj-lightsaber-light-m.jpg') no-repeat;
        left: 0px;
        top: 1408px;
        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: 1550px;
        left: 0px;
        top: 641px;
        float: left;
        overflow: hidden;
        clip: rect(0px, 133px, 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/luke-skywalker-rotj-lightsaber-hilt-x-dt.png') no-repeat;
        left: -10px;
        top: -870px;
        cursor: pointer;
    }
    
    .masker {
        position: relative;
        width: 148px;
        height: 230px;
        left: 0px;
        top: 1430px;
        background-color: #000;
    }

    .blade {
        position: absolute;
        width: 148px;
        height: 1432px;
        background: url('/content/dam/en-zz/Solutions/geforce/titan-xp-collectors-edition/lightsabers/images/luke-skywalker-rotj-lightsaber-light-dt.jpg') no-repeat;
        left: -10px;
        top: 1800px;
        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: 1432px;
        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/luke-skywalker-rotj-lightsaber-hilt-x-dt.png') no-repeat;
        left: -10px;
        top: -845px;
        cursor: pointer;
    }
    
    .masker {
        position: relative;
        width: 148px;
        height: 230px;
        left: 0px;
        top: 1428px;
        background-color: #000;
    }

    .blade {
        position: absolute;
        width: 148px;
        height: 1432px;
        background: url('/content/dam/en-zz/Solutions/geforce/titan-xp-collectors-edition/lightsabers/images/luke-skywalker-rotj-lightsaber-light-dt.jpg') no-repeat;
        left: -10px;
        top: 1320px;
        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 -870px;
        left: 50%;
        top: 878px; /* MAY VARY IN LIVE ENVIRONMENT */
        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/luke-skywalker-rotj-lightsaber-hilt-x-u.png') no-repeat;
        left: 0px;
        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/luke-skywalker-rotj-lightsaber-light-u.jpg') no-repeat;
        left: 0px;
        top: 1380px;
        opacity: 0;
    }

}