@charset "utf-8";
@import url('gen-banners.css');
@import url('style_gen.css');
:root{
	--text-main-color: #000;
}
/*======================COMMON RULES=====================*/
body * {overflow: hidden;}
#myBanners{position: relative; left: 50%; margin-top: 30px; margin-bottom: 30px; transform: translate(-50%, 0%);}
section{position: absolute;}
.banner-wrapper{position: relative; overflow: hidden; cursor: pointer;}
.mRec{width: var(--mRec-w); height: var(--squRec-d);}
.halfPage{width: var(--mRec-w); height: var(--sky-h);}
.sky{width: var(--wSky-w); height: var(--sky-h);}
.lead{width: var(--leadB-w); height: var(--leadB-h);}
.IAB{width: var(--IAB-w); height: var(--squRec-d);}
.banner-thumb, .banner-wrapper iframe{width: 100%; height: 100%; display: block; border: 0;}

/*========================================SCREEN RULES 320=============================================*/
@media (min-width: 320px){
	#desc, #myBanners{width: var(--mRec-w);}
	#myBanners{height: calc(var(--squRec-d) * 6 + var(--sky-h) * 5 + 100px);}
	#Cleopatra2 .sky, #Cleopatra2 .lead, #hotOf7s .lead, #hotOf7s .IAB, #mca777 .sky, #dond .sky, #MMDII .halfPage, #RRFF .sky, #jurassicParkGold .mRec, #jurassicParkGold .IAB{display: none;}
	#lightsCameraSpin{top: 0;}
	#progressiveJackpot{top: calc(var(--squRec-d) + 10px);}
	#Cleopatra2{top: calc(var(--squRec-d) + var(--sky-h) + 20px);}
	#vipLiveDealer{top: calc(var(--squRec-d) * 2 + var(--sky-h) * 2 + 40px);}
	#hotOf7s{top: calc(var(--squRec-d) * 2 + var(--sky-h) + 30px);}
	#mca777{top: calc(var(--squRec-d) * 3 + var(--sky-h) * 2 + 50px);}
	#dond{top: calc(var(--squRec-d) * 3 + var(--sky-h) * 3 + 60px);}
	#MMDII{top: calc(var(--squRec-d) * 4 + var(--sky-h) * 4 + 80px);}
	#RRFF{top: calc(var(--squRec-d) * 5 + var(--sky-h) * 4 + 90px);}
	#jurassicParkGold{top: calc(var(--squRec-d) * 4 + var(--sky-h) * 3 + 70px);}
	#footballPredictor{top: calc(var(--squRec-d) * 5 + var(--sky-h) * 5 + 100px);}
}

/*========================================SCREEN RULES 480=============================================*/
@media (min-width: 480px){
	#desc, #myBanners{width: calc(var(--mRec-w) + var(--wSky-w) + 10px);}
	#myBanners{height: calc(var(--squRec-d) * 3 + var(--sky-h) * 3 + 50px);}
	#Cleopatra2 .mRec, #Cleopatra2 .lead, #mca777 .halfPage, #dond .mRec, #RRFF .mRec, #RRFF .halfPage, #jurassicParkGold .halfPage, #jurassicParkGold .IAB{display: none;}
	#Cleopatra2 .sky, #mca777 .sky, #dond .sky, #RRFF .sky, #jurassicParkGold .mRec{display: block;}
	#lightsCameraSpin{top: calc(var(--sky-h) - var(--squRec-d) * 2 - 10px); left: 0;}
	#progressiveJackpot{top: calc(var(--sky-h) + 10px); left: calc(var(--wSky-w) + 10px);}
	#Cleopatra2{top: 0; left: calc(var(--mRec-w) + 10px);}
	#vipLiveDealer{top: calc(var(--sky-h) - var(--squRec-d)); left: 0;}
	#hotOf7s{top: calc(var(--sky-h) * 2 + 20px); left: 0;}
	#mca777{top: calc(var(--sky-h) + 10px); left: 0;}
	#dond{top: calc(var(--sky-h) * 2 + 20px); left: calc(var(--mRec-w) + 10px);}
	#MMDII{top: calc(var(--sky-h) * 3 + var(--squRec-d) + 40px); left: calc(var(--wSky-w) + 10px);}
	#RRFF{top: calc(var(--sky-h) * 3 + 30px); left: 0;}
	#jurassicParkGold{top: calc(var(--sky-h) * 3 + 30px); left: calc(var(--wSky-w) + 10px);}
	#footballPredictor{top: calc(var(--sky-h) * 3 + var(--squRec-d) * 2 + 50px); left: calc(var(--wSky-w) + 10px);}
}

/*========================================SCREEN RULES 768=============================================*/
@media (min-width: 768px){
	#desc, #myBanners{width: var(--leadB-w);}
	#myBanners{height: calc(var(--squRec-d) * 2 + var(--leadB-h) * 2 + var(--sky-h) * 2 + 50px) ;}
	#Cleopatra2 .mRec, #Cleopatra2 .sky, #hotOf7s .halfPage, #hotOf7s .IAB, #mca777 .sky, #jurassicParkGold .mRec, #jurassicParkGold .IAB{display: none;}
	#Cleopatra2 .lead, #hotOf7s .lead, #mca777 .halfPage, #jurassicParkGold .halfPage{display: block;}
	#lightsCameraSpin{top: 0; left: calc((var(--leadB-w) - var(--mRec-w) * 2 - 10px) / 2);}
	#progressiveJackpot{top: calc(var(--squRec-d) + var(--leadB-h) + 20px); left: calc((var(--leadB-w) - var(--mRec-w) - var(--wSky-w) * 2 - 20px) / 2 + var(--wSky-w) * 2 + 20px);}
	#Cleopatra2{top: calc(var(--squRec-d) + 10px); left: 0;}
	#vipLiveDealer{top: 0; left: calc((var(--leadB-w) - var(--mRec-w) * 2 - 10px) / 2 + var(--mRec-w) + 10px);}
	#hotOf7s{top: calc(var(--squRec-d) * 2 + var(--leadB-h) + var(--sky-h) + 40px); left: 0;}
	#mca777{top: calc(var(--squRec-d) * 2 + var(--leadB-h) * 2 + var(--sky-h) + 50px); left: calc((var(--leadB-w) - var(--mRec-w) * 2 - 10px) / 2);}
	#dond{top: calc(var(--squRec-d) + var(--leadB-h) + 20px); left: calc((var(--leadB-w) - var(--mRec-w) - var(--wSky-w) * 2 - 20px) / 2);}
	#MMDII{top: calc(var(--squRec-d) + var(--leadB-h) + var(--sky-h) + 30px); left: calc((var(--leadB-w) - var(--mRec-w) * 2 - 10px) / 2);}
	#RRFF{top: calc(var(--squRec-d) + var(--leadB-h) + 20px); left: calc((var(--leadB-w) - var(--mRec-w) - var(--wSky-w) * 2 - 20px) / 2 + var(--wSky-w) + 10px);}
	#jurassicParkGold{top: calc(var(--squRec-d) * 2 + var(--leadB-h) * 2 + var(--sky-h) + 50px); left: calc((var(--leadB-w) - var(--mRec-w) * 2 - 10px) / 2 + var(--mRec-w) + 10px);}
	#footballPredictor{top: calc(var(--squRec-d) + var(--leadB-h) + var(--sky-h) + 30px); left: calc((var(--leadB-w) - var(--mRec-w) * 2 - 10px) / 2 + var(--mRec-w) + 10px);}
}

/*========================================SCREEN RULES 1024=============================================*/
@media (min-width: 1024px){
	#desc, #myBanners{width: calc(var(--mRec-w) * 2 + var(--wSky-w) * 2 + 60px);}
	#myBanners{height: calc(var(--squRec-d) * 4 + var(--sky-h) + var(--leadB-h) + 100px);}
	#hotOf7s .halfPage, #hotOf7s .lead, #mca777 .halfPage, #dond .sky, #MMDII .mRec, #jurassicParkGold .mRec, #jurassicParkGold .halfPage{display: none;}
	#hotOf7s .IAB, #mca777 .sky, #dond .mRec, #MMDII .halfPage, #jurassicParkGold .IAB{display: block;}
	#lightsCameraSpin{top: 0; left: calc((var(--mRec-w) * 2 + var(--wSky-w) * 2 + 40px - var(--mRec-w) * 2) / 2);}
	#progressiveJackpot{top: calc(var(--squRec-d) + var(--leadB-h) + 40px); left: 0;}
	#Cleopatra2{top: calc(var(--squRec-d) + 20px); left: calc((var(--mRec-w) * 2 + var(--wSky-w) * 2 + 60px - var(--leadB-w)) / 2);}
	#vipLiveDealer{top: 0; left: calc((var(--mRec-w) * 2 + var(--wSky-w) * 2 + 40px - var(--mRec-w) * 2) / 2 + var(--mRec-w) + 20px);}
	#hotOf7s{top: calc(var(--squRec-d) + var(--leadB-h) + var(--sky-h) + 60px); left: calc((var(--mRec-w) * 2 + var(--wSky-w) * 2 + 60px - var(--IAB-w)) / 2);}
	#mca777{top: calc(var(--squRec-d) + var(--leadB-h) + 40px); left: calc(var(--mRec-w) + 20px);}
	#dond{top: calc(var(--squRec-d) * 3 + var(--leadB-h) + var(--sky-h) + 100px); left: calc((var(--mRec-w) * 2 + var(--wSky-w) * 2 + 40px - var(--mRec-w) * 2) / 2);}
	#MMDII{top: calc(var(--squRec-d) + var(--leadB-h) + 40px); left: calc(var(--mRec-w) + var(--wSky-w) * 2 + 60px);}
	#RRFF{top: calc(var(--squRec-d) + var(--leadB-h) + 40px); left:  calc(var(--mRec-w) + var(--wSky-w) + 40px);}
	#jurassicParkGold{top: calc(var(--squRec-d) * 2 + var(--leadB-h) + var(--sky-h) + 80px); left: calc((var(--mRec-w) * 2 + var(--wSky-w) * 2 + 60px - var(--IAB-w)) / 2);}
	#footballPredictor{top: calc(var(--squRec-d) * 3 + var(--leadB-h) + var(--sky-h) + 100px); left: calc((var(--mRec-w) * 2 + var(--wSky-w) * 2 + 40px - var(--mRec-w) * 2) / 2 + var(--mRec-w) + 20px);}
}

