/* COMMON */
.clear { clear: both; }
.rel { position: relative; }
.abs { position: absolute; }
.floatLeft { float: left; }
.floatRight { float: right; }

#thtv-content-spacing > br { display: none; }
#aspnetForm > div.clear > br { display: none; }

h1, h2, h3, h4, h5, h6 { padding: 0px; margin: 0px; }

a, a span, input[type='submit'] {
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

a { color: #000000; font-weight: bold; }

.standard20 { font-size: 20px; }


/* MAIN LAYOUT ITEMS */
html {
    position: relative;
    min-height: 100%;
}

body {
    background-color: #d85500;
    font-family: arial, sans-serif;
    font-size: 16px;
    font-weight: normal;
    line-height: 21px;
    color: #000000;
    overflow-x: hidden;
}

body#default-pg { background: #f3eeee url('../images/background-main.jpg') top center no-repeat; }

body#enter-pg,
body#enter-instant-pg,
body#again-pg,
body#thanks-pg,
body#win-pg,
body#sorry-pg,
body#closed-pg { background: #eae7e7 url('../images/background-enter.jpg') top center no-repeat; }


iframe { max-width: 100%; }

#promo-wrap {
	position: relative;
	margin: 0 auto;
    z-index: 2;
}

#ytv-content {
	position: relative;
	margin: 95px auto;
}

h1 { position: absolute; top: -40px; left: -200px; z-index: 1001; }
body#default-pg h1 { position: relative; top: auto; left: auto; margin: 0 auto; width: 273px; }

h2 { text-align: center; }
body#prizes-pg h2 { margin-top: -35px; }

footer { margin-bottom: 50px; }



/* NAV ITEMS */
nav {
    background: transparent url('../images/background-nav.png') top center repeat-x;
    width: 100%;
    height: 95px;
    padding-top: 8px;
    text-align: center;
}

nav a { position: relative; background: transparent url('../images/navigation.png') 0px 0px no-repeat; height: 45px; display: inline-block; text-indent: -9999px; }
nav a span { position: absolute; top: 0px; left: 0px; background: transparent url('../images/navigation.png') 0px -45px no-repeat; height: 45px; display: block; opacity: 0; }
nav a:hover span { opacity: 1; }

.nav1 { width: 63px; background-position: 0px 0px; }
.nav1 span { width: 63px; background-position: 0px -45px; }
body#default-pg .nav1 span { opacity: 1; }

.nav2 { width: 85px; background-position: -63px 0px; }
.nav2 span { width: 85px; background-position: -63px -45px; }
body#prizes-pg .nav2 span { opacity: 1; }

.nav3 { width: 61px; background-position: -148px 0px; }
.nav3 span { width: 61px; background-position: -148px -45px; }
body#play-pg .nav3 span,
body#play-triple-power-push-pop-pg .nav3 span,
body#play-right-on-ring-pop-pg .nav3 span,
body#play-baby-bottle-pocket-rocket-pg .nav3 span,
body#play-top-of-the-juicy-drop-pop-pg .nav3 span { opacity: 1; }

.nav4 { width: 71px; background-position: -209px 0px; }
.nav4 span { width: 71px; background-position: -209px -45px; }

.nav5 { width: 72px; background-position: -280px 0px; }
.nav5 span { width: 72px; background-position: -280px -45px; }
body#enter-pg .nav5 span,
body#enter-instant-pg .nav5 span,
body#again-pg .nav5 span,
body#win-pg .nav5 span,
body#sorry-pg .nav5 span { opacity: 1; }




/* HOME ITEMS */
.btnPlayPushPop { position: absolute; top: -25px; left: 15px; background: transparent url('../images/btn-play-push-pop.png') 0px 0px no-repeat; width: 197px; height: 168px; display: block; text-indent: -9999px; }
.btnPlayPushPop span { position: absolute; top: 0px; left: 0px; background: transparent url('../images/btn-play-push-pop.png') 0px -168px no-repeat; width: 197px; height: 168px; display: block; text-indent: -9999px; opacity: 0; }
.btnPlayPushPop:hover span { opacity: 1; }

.btnPlayRingPop { position: absolute; top: 25px; left: 195px; background: transparent url('../images/btn-play-ring-pop.png') 0px 0px no-repeat; width: 167px; height: 188px; display: block; text-indent: -9999px; }
.btnPlayRingPop span { position: absolute; top: 0px; left: 0px; background: transparent url('../images/btn-play-ring-pop.png') 0px -188px no-repeat; width: 167px; height: 188px; display: block; text-indent: -9999px; opacity: 0; }
.btnPlayRingPop:hover span { opacity: 1; }

.btnPlayBottlePop { position: absolute; top: 28px; right: 180px; background: transparent url('../images/btn-play-bottle-pop.png') 0px 0px no-repeat; width: 178px; height: 169px; display: block; text-indent: -9999px; }
.btnPlayBottlePop span { position: absolute; top: 0px; left: 0px; background: transparent url('../images/btn-play-bottle-pop.png') 0px -169px no-repeat; width: 169px; height: 188px; display: block; text-indent: -9999px; opacity: 0; }
.btnPlayBottlePop:hover span { opacity: 1; }

.btnPlayDropPop { position: absolute; top: -25px; right: 15px; background: transparent url('../images/btn-play-drop-pop.png') 0px 0px no-repeat; width: 178px; height: 178px; display: block; text-indent: -9999px; }
.btnPlayDropPop span { position: absolute; top: 0px; left: 0px; background: transparent url('../images/btn-play-drop-pop.png') 0px -178px no-repeat; width: 169px; height: 178px; display: block; text-indent: -9999px; opacity: 0; }
.btnPlayDropPop:hover span { opacity: 1; }

.imgCogPlay { position: absolute; top: 220px; left: 80px; z-index: 1000; }

.imgCogPlay.cogPushPop,
.imgCogPlay.cogRingPop,
.imgCogPlay.cogBottlePop,
.imgCogPlay.cogDropPop { opacity: 0; 
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.imgMachine { margin: -25px 35px 0px 0px; float: right; }

.homeSecondary_container {
    position: relative;
    width: 100%;
    float: left;
    margin-bottom: 50px;
}

.imgWantMorePrizes { position: relative; margin: -80px 0px 0px -30px; float: left; z-index: 2; }
.imgPrizeCounter { position: absolute; top: 34px; left: 150px; z-index: 1; }

.imgThermometer { position: absolute; top: -10px; left: 372px; z-index: 2; width: 189px; }

.imgPrizes { position: absolute; top: -40px; right: 315px; z-index: 3; }
.imgPlus  { position: relative; margin: -10px -5px 0px 0px; float: right; z-index: 1; }

.imgHungry { position: relative; margin: 20px 0px 0px 0px; float: left; }

.btnEnterHereSmall { position: absolute; top: -45px; left: 284px; background: transparent url('../images/btn-enter-here-small.png') 0px 0px no-repeat; width: 143px; height: 144px; display: block; text-indent: -9999px; z-index: 1000; }
.btnEnterHereSmall span { position: absolute; top: 0px; left: 0px; background: transparent url('../images/btn-enter-here-small.png') 0px -144px no-repeat; width: 143px; height: 144px; display: block; text-indent: -9999px; opacity: 0; }
.btnEnterHereSmall:hover span { opacity: 1; }

.btnEnterHereLarge { position: absolute; top: 312px; right: 10px; background: transparent url('../images/btn-enter-here-large.png') 0px 0px no-repeat; width: 198px; height: 198px; display: block; text-indent: -9999px; z-index: 3; }
.btnEnterHereLarge span { position: absolute; top: 0px; left: 0px; background: transparent url('../images/btn-enter-here-large.png') 0px -198px no-repeat; width: 198px; height: 198px; display: block; text-indent: -9999px; opacity: 0; }
.btnEnterHereLarge:hover span { opacity: 1; }



/* PRIZE ITEMS */
.flipperContainer {
    position: relative;
    width: 780px;
    height: 560px;
    margin: 0 auto;
    margin-top: 40px;
    margin-bottom: 10px;
    font-family: arial;
    font-size: 18px;
    line-height: 24px;
    font-weight: normal;
    text-align: left;
    color: #000000;
    z-index: 100;
}

.article-image {
    text-align: center;
}

.article-image p {
    font-size: 32px;
    font-weight: bold;
    letter-spacing: -0.02em;
    padding: 60px 100px 40px 100px;
}

.btnPrevious { position: absolute; top: 50%; left: 15px; margin-top: -44px; background: transparent url('../images/btn-previous.png') 0px 0px no-repeat; width: 62px; height: 88px; display: block; text-indent: -9999px; z-index: 3; }
.btnPrevious span { position: absolute; top: 0px; left: 0px; background: transparent url('../images/btn-previous.png') 0px -88px no-repeat; width: 62px; height: 88px; display: block; text-indent: -9999px; opacity: 0; }
.btnPrevious:hover span { opacity: 1; }

.btnNext { position: absolute; top: 50%; right: 0px; margin-top: -44px; background: transparent url('../images/btn-next.png') 0px 0px no-repeat; width: 62px; height: 88px; display: block; text-indent: -9999px; z-index: 3; }
.btnNext span { position: absolute; top: 0px; left: 0px; background: transparent url('../images/btn-next.png') 0px -88px no-repeat; width: 62px; height: 88px; display: block; text-indent: -9999px; opacity: 0; }
.btnNext:hover span { opacity: 1; }

.prizeContainer {
    position: relative;
    width: 100%;
    float: left;
    margin-bottom: 50px;
}

.imgEnterChance { position: absolute; top: 30px; left: 150px; z-index: 2; }
.imgGrandPrize { position: relative; margin: 42px 120px 0px 0px; float: right; z-index: 1; }

.btnPlayTheGames { margin-bottom: -5px; margin-top: -8px; display: block; }

.btnEnterHerePrizes { position: absolute; bottom: 45px; right: 38px; background: transparent url('../images/btn-enter-here-purple.png') 0px 0px no-repeat; width: 195px; height: 200px; display: block; text-indent: -9999px; z-index: 1000; }
.btnEnterHerePrizes span { position: absolute; top: 0px; left: 0px; background: transparent url('../images/btn-enter-here-purple.png') 0px -200px no-repeat; width: 195px; height: 200px; display: block; text-indent: -9999px; opacity: 0; }
.btnEnterHerePrizes:hover span { opacity: 1; }




/* GAME ITEMS */
.playContainer {
    position: relative;
    width: 100%;
    float: left;
    margin: 130px 0px 80px 10px;
    text-align: center;
}

.btnPlayPushPop_large { position: absolute; top: -105px; left: 20px; z-index: 1; }
.btnPlayRingPop_large { position: absolute; bottom: -105px; left: 20px; z-index: 1; }
.btnPlayBottlePop_large { position: absolute; top: -105px; right: 20px; z-index: 1; }
.btnPlayDropPop_large { position: absolute; bottom: -105px; right: 20px; z-index: 1; }

.gameContainer {
    position: relative;
    width: 800px;
    height: 600px;
    max-width : 800px;
    max-height : 600px;
    float: left;
    margin: 100px 0px 0px 88px;
    text-align: center;
}

.gameFrame {
    position: absolute;
    top: -118px;
    left: -125px;
    z-index: 1000;
    width: 1042px;
    pointer-events : none;
}



/* ENTER ITEMS */
.enterContainer {
    position: relative;
    width: 700px;
    float: left;
    margin: 10px 0px 40px 140px;
}

body#enter-instant-pg .enterContainer { margin-top: 50px; }

.enterContainer ol { list-style: lower-latin; margin: 0px 0px 15px 60px; }
.enterContainer ol li { padding-bottom: 5px; }

.declaration { padding: 0px 30px 20px 0px; }

.btnSubmit { position: relative; background: transparent url('../images/btn-submit.png') 0px 0px no-repeat; width: 143px; height: 144px; display: block; text-indent: -9999px; margin: 0px 50px 0px 0px; float: right; }
.btnSubmit span { position: absolute; top: 0px; left: 0px; background: transparent url('../images/btn-submit.png') 0px -144px no-repeat; width: 143px; height: 144px; display: block; text-indent: -9999px; opacity: 0; }
.btnSubmit:hover span { opacity: 1; }

.instantCongrats {
    font-size: 22px;
    margin-bottom: 25px;
    text-align: center; 
}

.instantPrize {
    max-width: 60%;
    margin: 0 auto;
    text-align: center;
    margin-bottom: 50px;
}

.cogToronto {
    position: absolute;
    top: -40px;
    right: -80px;
}



/* GENERAL ITEMS */
.staticContainer {
    position: relative;
    width: 700px;
    height: 500px;
    float: left;
    margin: 40px 0px 20px 140px;
    text-align: center;
    font-size: 22px;
    line-height: 26px;
    font-weight: bold;
}

.staticContainer a { text-decoration: underline; }





/* Note: General rules for Tablet and Mobile */
@media screen and (max-width: 959px) {

}


/* Note: Design for a width of 768px #Tablet (Landscape) */
@media only screen and (min-width: 960px) and (max-width: 1300px) {

    h1 { top: -20px; left: -10px; width: 175px; }

}


/* Note: Design for a width of 768px #Tablet (Portrait) */
@media only screen and (min-width: 768px) and (max-width: 959px) {

    h1 { top: -90px; left: 0px; width: 130px; }

    /* HOME ITEMS */
    .btnPlayPushPop { top: -25px; left: 18px; }
    .btnPlayRingPop { top: 140px; left: 80px; }
    .btnPlayBottlePop { top: 145px; right: 70px; }
    .btnPlayDropPop { top: -25px; right: 15px; }

    .imgCogPlay { position: absolute; top: 340px; left: 0px; }

    .imgMachine { margin: 65px 0px 0px 0px; width: 350px; }

    .imgWantMorePrizes { margin: -10px 0px 0px 0px; width: 350px; }
    .imgPrizeCounter { top: 30px; left: 120px; width: 240px; }

    .imgThermometer { top: 25px; left: 295px; width: 130px; }

    .imgPrizes { top: -14px; right: 235px; width: 100px; }
    .imgPlus { margin: 0px 0px 0px 0px; width: 300px; }

    .imgHungry { margin: 40px 0px 0px 0px; width: 500px; }

    .btnEnterHereSmall { top: -70px; left: 200px; }
    .btnEnterHereLarge { top: 240px; right: 0px; }

    /* PRIZE ITEMS */
    .flipperContainer { width: 720px; }

    .imgEnterChance { top: 30px; left: 15px; }
    .imgGrandPrize { margin: 42px 12px 0px 0px; }

    .btnEnterHerePrizes { bottom: -30px; right: auto; left: 210px; }

    /* GAME ITEMS */
    .btnPlayPushPop_large, 
    .btnPlayRingPop_large,
    .btnPlayBottlePop_large,
    .btnPlayDropPop_large { width: 260px; }

    .btnPlayPushPop_large { top: -80px; left: 0px; }
    .btnPlayRingPop_large { bottom: -80px; left: 0px; }
    .btnPlayBottlePop_large { top: -80px; right: 0px; }
    .btnPlayDropPop_large { bottom: -80px; right: 0px; }

    /* ENTER ITEMS */
    .enterContainer { margin: 20px 0px 40px 20px; }

    /* GENERAL ITEMS */
    .staticContainer { margin: 40px 0px 20px 20px; }

}


/* Note: Design for Mobile */
@media screen and (max-width: 767px) {


}


/* Note: Design for a width of 480px #Mobile (Landscape) */
@media only screen and (min-width: 480px) and (max-width: 767px) {


}


/* Note: Design for a width of 320px #Mobile (Portrait) */
@media only screen and (max-width: 479px) {


}

#ytv-casl { display: none; }




/* ANIMATION ITEMS */
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse;

    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;

    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;

    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

.btnPlayPushPop.pulse, .btnPlayPushPop_large.pulse { -webkit-animation-duration: 1.2s; animation-duration: 1.2s; }
.btnPlayRingPop.pulse, .btnPlayRingPop_large.pulse { -webkit-animation-duration: 1.5s; animation-duration: 1.5s; }
.btnPlayBottlePop.pulse, .btnPlayBottlePop_large.pulse { -webkit-animation-duration: 1.8s; animation-duration: 1.8s; }
.btnPlayDropPop.pulse, .btnPlayDropPop_large.pulse { -webkit-animation-duration: 1.6s; animation-duration: 1.6s; }

.btnEnterHereSmall.pulse { -webkit-animation-duration: 1.5s; animation-duration: 1.5s; }
.btnEnterHereLarge.pulse { -webkit-animation-duration: 1.2s; animation-duration: 1.2s; }

.pulse:hover {
    -webkit-animation-duration: 0s;
    animation-duration: 0s;
}