


.spotlightbox {
  position: relative;
  display: block;
  width: 590px;
  height: 275px;
}

#spotlightboxbackground {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 528px;
    height:323px;
    background: url(https://cdn.ghstatic.com/images/site/zylom/sprites/spotlight.png?v=20210503.171.320) 0 0 no-repeat;

}

#spotlightcorner_lu {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 24px;
    height:19px;
    background: url(https://cdn.ghstatic.com/images/site/zylom/sprites/spotlight.png?v=20210503.171.320) -200px -323px; no-repeat;
    z-index:3
}

#spotlightcorner_lb {
    position: absolute;
    top: 271px;
    left: 0px;
    width: 22px;
    height: 23px;
    background: url(https://cdn.ghstatic.com/images/site/zylom/sprites/spotlight.png?v=20210503.171.320) -152px -323px; no-repeat;
    z-index:3
}

#spotlightcorner_ru {
    position: absolute;
    top: 0px;
    left: 504px;
    width: 23px;
    height: 19px;
    background: url(https://cdn.ghstatic.com/images/site/zylom/sprites/spotlight.png?v=20210503.171.320) -224px -323px; no-repeat;
    z-index:3
}

#spotlightcorner_rb {
    position: absolute;
    top: 270px;
    left: 505px;
    width: 24px;
    height: 19px;
    background: url(https://cdn.ghstatic.com/images/site/zylom/sprites/spotlight.png?v=20210503.171.320) -177px -323px; no-repeat;
    z-index:3
}

#multiplayeroverview #spotlightboxbackground {
    background: url(https://cdn.ghstatic.com/images/site/zylom/sprites/spotlight_multi.png?v=20210503.171.320) 0 0 no-repeat;
}

#multiplayeroverview #spotlightcorner_lu {
    background: url(https://cdn.ghstatic.com/images/site/zylom/sprites/spotlight_multi.png?v=20210503.171.320) -200px -323px; no-repeat;
    height:18px;
}

#multiplayeroverview #spotlightcorner_lb {
    background: url(https://cdn.ghstatic.com/images/site/zylom/sprites/spotlight_multi.png?v=20210503.171.320) -152px -323px; no-repeat;
}

#multiplayeroverview #spotlightcorner_ru {
    background: url(https://cdn.ghstatic.com/images/site/zylom/sprites/spotlight_multi.png?v=20210503.171.320) -224px -323px; no-repeat;
    height:18px;
}

#multiplayeroverview #spotlightcorner_rb {
    background: url(https://cdn.ghstatic.com/images/site/zylom/sprites/spotlight_multi.png?v=20210503.171.320) -177px -323px; no-repeat;
    left: 506px;
}

#overlay,
#overlayA {
    position: absolute;
    top: 0;
    left: 0;
    background-color: #fff;
    width: 590px;
    height: 243px;
    display: none;
    z-index: 2;
    opacity: 0;
}



.spotlightcontrol {
    position: absolute;
    top: 238px;
    left: 0;
    width: 590px;
    z-index: 4;
    height: 36px;
    background-position: 0px 36px;
    background-image: url(https://cdn.ghstatic.com/images/site/zylom/spotlight/frame/hero-bottom-orange.png?v=20210503.171.320);
}
.spotlightcontrolitems {
    float: left;
    padding-top: 9px;
    width: 140px;
    height: 23px;
}
.spotlightcontrolitems a {
  background: url(https://cdn.ghstatic.com/images/site/zylom/spotlight/frame/spotlight-icons.png?v=20210503.171.320) no-repeat 6px -16px;
  width: 17px;
  height: 17px;
  display: inline-block;
  float: left;
  margin-right: 3px;
  overflow: hidden;
}
a.spotlight_tab1 { background-position:0px -36px; }
a.spotlight_tab1_active { background-position:0px -57px; }
a.spotlight_tab2 { background-position:0px -36px; }
a.spotlight_tab2_active { background-position:0px -57px; }
a.spotlight_tab3 { background-position:0px -36px; }
a.spotlight_tab3_active { background-position:0px -57px; }
a.spotlight_tab4 { background-position:0px -36px; }
a.spotlight_tab4_active { background-position:0px -57px; }
a.spotlight_tab5 { background-position:0px -36px; }
a.spotlight_tab5_active { background-position:0px -57px; }
a.spotlight_tab6 { background-position:0px -36px; }
a.spotlight_tab6_active { background-position:0px -57px; }

.spotlightcontrolcurrentitem {
    float: left;
    padding: 10px 5px 5px 5px;
    width: 400px;
    font-size: 12px;
    color: #fff;
}
.spotlightcontrolbuttons {
    float: left;
    width: 20px;
    padding: 10px 5px 5px 5px;
}
.spotlightpromo {
    position: absolute;
}
.spotlightcontrolbuttons a {
  background: url(https://cdn.ghstatic.com/images/site/zylom/spotlight/frame/spotlight-icons.png?v=20210503.171.320) no-repeat 6px -16px;
  display: block;
  float: left;
  width: 17px;
  height: 16px;
  text-decoration: none;
}
a.spotlight_previous { background-position:0 -323px; }
a:hover.spotlight_previous { background-position:0 -341px; }
a.spotlight_next { background-position:-19px -323px; width:17px; }
a:hover.spotlight_next { background-position:-19px -341px; }
a.spotlight_pause { background-position:6px -16px; }
a:hover.spotlight_pause { background-position:6px -16px; }
a.spotlight_play { background-position:6px 3px; }
a:hover.spotlight_play { background-position:6px 3px; }

#multiplayeroverview .spotlightcontrolitems a {
  background: transparent url(https://cdn.ghstatic.com/images/site/zylom/sprites/spotlight.png?v=20210503.171.320) 0 -323px no-repeat;
}
#multiplayeroverview a.spotlight_tab1 { background-position:-74px -323px; }
#multiplayeroverview a.spotlight_tab1_active { background-position:-74px -336px; }
#multiplayeroverview a.spotlight_tab2 { background-position:-87px -323px; }
#multiplayeroverview a.spotlight_tab2_active { background-position:-87px -336px; }
#multiplayeroverview a.spotlight_tab3 { background-position:-100px -323px; }
#multiplayeroverview a.spotlight_tab3_active { background-position:-100px -336px; }
#multiplayeroverview a.spotlight_tab4 { background-position:-113px -323px; }
#multiplayeroverview a.spotlight_tab4_active { background-position:-113px -336px; }
#multiplayeroverview a.spotlight_tab5 { background-position:-126px -323px; }
#multiplayeroverview a.spotlight_tab5_active { background-position:-126px -336px; }
#multiplayeroverview a.spotlight_tab6 { background-position:-139px -323px; }
#multiplayeroverview a.spotlight_tab6_active { background-position:-139px -336px; }

#multiplayeroverview .spotlightcontrolbuttons a {
  background: transparent url(https://cdn.ghstatic.com/images/site/zylom/sprites/spotlight.png?v=20210503.171.320) 0 -323px no-repeat;
}
#multiplayeroverview a.spotlight_previous { background-position:0 -323px; }
#multiplayeroverview a:hover.spotlight_previous { background-position:0 -341px; }
#multiplayeroverview a.spotlight_next { background-position:-19px -323px; width:17px; }
#multiplayeroverview a:hover.spotlight_next { background-position:-19px -341px; }
#multiplayeroverview a.spotlight_pause { background-position:-36px -323px; }
#multiplayeroverview a:hover.spotlight_pause { background-position:-36px -341px; }
#multiplayeroverview a.spotlight_play { background-position:-55px -323px; }
#multiplayeroverview a:hover.spotlight_play { background-position:-55px -341px; }

.spotlightitem {
  display: block;
  width: 202px;
  height: 46px;
  padding: 0;
  color: #000;
  font-size: 0.9em;
  line-height: 14px;
  font-weight: bold;
  text-decoration: none;
  opacity:.5; filter:alpha(opacity=50);
  background: transparent;
}
.spotlightitem span {
  display: block;
  height: 29px !important;
  height: 33px;
  padding: 6px 6px 0px 25px;
  overflow: hidden;
  cursor: pointer;
}
.spotlightitemhover {
  display: block;
  width: 202px;
  height: 46px;
  padding: 0;
  color: #000;
  font-size: 0.9em;
  line-height: 14px;
  font-weight: bold;
  text-decoration: none;
  background: transparent;
  opacity:1; filter:alpha(opacity=100);
}  
.spotlightitemhover span {
  display: block;
  height: 29px !important;
  height: 33px;
  padding: 6px 6px 0px 25px;
  overflow: hidden;
  cursor: pointer;
}

.spotlightitem img, .spotlightitemhover img {
  float: left;
  margin: 2px 6px 0px 0px;
  border: 0;
}

.spotlightsinglegameplacer {
    display: block;
    position: absolute;
    width: 590px;
    height: 243px;
}
.spotlightsinglegameplacer a.clickbox {
    display: block;
    position: absolute;
    top: 0;
    width: 590px;
    height: 243px;
    text-decoration: none;
}
.spotlightsinglegameplacer a.clickbox span {
    line-height: 0;
    font-size: 0;
    visibility: hidden;
}
.spotlightsinglegameplacer .infobuttontext, .spotlightsinglegameplacer .playbuttontext_dl, .spotlightsinglegameplacer .playbuttontext {
    display: block;
    position: absolute;
    top: 200px;
    font-size: 12px;
    font-weight: bold;
    float: left;
    width: 168px;
    height: 37px;
    right: 185px;
}

.spotlightsinglegameplacer .downloadbuttontext {
    float: right;
    width: 240px;
    height: 59px;
    font-size: 12px;
    font-weight: bold;
}

.spotlightsinglegameplacer .infobuttontext {right: 10px;}
.spotlightsinglegameplacer .playbuttontext_dl {left: 152px;}

.infobuttontext {
   background: transparent url('https://cdn.ghstatic.com/images/site/zylom/buttons/spotlight_buttons/button_blue/button_blue.png?v=20210503.171.320') 0px 0px no-repeat;
}
.playbuttontext_dl {
   background: transparent url('https://cdn.ghstatic.com/images/site/zylom/buttons/spotlight_buttons/button_green/button_green.png?v=20210503.171.320') 0px 0px no-repeat;
}
.downloadbuttontext {
   background: transparent url('https://cdn.ghstatic.com/images/site/zylom/spotlight/frame/zy-spotlight-button.png?v=20210503.171.320') 0px 0px no-repeat;
}
.playbuttontext {
   background: transparent url('https://cdn.ghstatic.com/images/site/zylom/buttons/spotlight_buttons/button_green/button_green.png?v=20210503.171.320') 0px 0px no-repeat;
}

.infobuttontext:hover,
.playbuttontext_dl:hover,
.playbuttontext:hover {
  background-position: 0px -40px;
}
.infobuttontext span,
.playbuttontext_dl span,
.playbuttontext span {
  display: block;
  color: #4f6f11;
  font-size: 14px !important;
  font-weight: bold;
  line-height: 29px !important;
  text-align: center;
  visibility: visible !important;
}

.downloadbuttontext span {
    display: block;
    color: #4f6f11;
    font-size: 14px !important;
    font-weight: bold;
    line-height: 57px !important;
    text-align: center;
    visibility: visible !important;
}

.infobuttontext span{color: #1c5e7b;}
.playbuttontext_dl span{color: #4f6f11;}
.downloadbuttontext span{color: #fff;}
.playbuttontext span{color: #4f6f11;}



/* banner overlays (doublepacks) */
.spotlightsinglegameplacer .spotlight_overlay {
    position: absolute;
    top: 224px;
    width: 590px;
    height: 49px;
    display: block;
}

.spotlightsinglegameplacer .spotlight_overlay_zsm {
    position: absolute;
    top: 214px;
    width: 590px;
    height: 63px;
    display: block;
}

/* login overlay (for personal offers) */
.spotlight_loginoverlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 590px;
    background-color: rgba(0,0,0,0.5);
}
.spotlight_loginoverlay div {
    width: 570px;
    color: #BFB9B9;
    font-size: 12px;
    line-height: 13px;
    padding: 10px;
}
.spotlight_loginoverlay span { 
  color: #FE6B57;
  font-weight: bold;
}
.spotlight_loginoverlay a {
    display: block;
    position: absolute;
    top: 6px;
    right: 6px;
    width: 16px;
    height: 16px;
    color: #fff;
}

.downloadbuttoncontainer {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 6;
}

.wwp-game {
    position: absolute;
    top: 0;
    left: 0;
}

.download-btn-link {
    position: absolute;
    width: 240px;
    height: 59px;
    bottom: 0;
    right: 0;
}

.download-btn-text {
    float: right;
    width: 240px;
    height: 59px;
    font-size: 14px;
    font-weight: bold;
    line-height: 59px;
    text-align: center;
    color: #fff;
}

.promo-copy {
    position: absolute;
    z-index: 6;
    bottom: 59px;
    right: 14px;
    max-width: 210px;
    color: #fff;
    font-weight: bold;
    text-shadow: 0 0 10px #000;
}

.spot_link {
    position:absolute;
    top:0;
    display:block;
    width:590px;
    height:243px;
    text-decoration: none; 
}