html, body{height:100%;}
body{background:url('catalog/background.png'); font-family: 'Orbitron', sans-serif; background-color: #f0f0f0;}
.container-fluid{padding: 0px;}

#logoDiv{background-color: #64FF01; position: fixed; top: 0; width: 100%;}
#logoDiv>img{max-width: 150px; padding: 10px;}

#preloader{position: absolute; margin-top: 70px; padding-top: 50%; background-color: #F3F3F3; color: #000000; width: 100%; height: 100%; font-size: 5rem; text-align: center; z-index: 1001;}

.introTitle{font-weight: bolder; padding: 5px; margin: 0; color: #000000; font-size: 22px; line-height: 35px;}
.mainBox{color: #333333; margin:0px; text-align: center; padding-top: 100px;}

.wheelSVG{ transform: translate(0%, 0%) matrix(1, 0, 0, 1, 0, 0) !important;}   
.wheelText{font-weight: bold; font-size: 40px !important;}
.wheelContainer{margin-top: 10%;}
#spinBtn-div{text-align:center;}
#spinBtn{margin-top:10px; width:75%; background-color: #000000 !important; color: #FFFFFF; font-weight:bold; padding:5px; cursor: pointer; border: none; border-radius: 5px;}
#spinBtn:hover{background-color: #000000 !important;}
.spinProcessing{background-color: #9E9E9E !important; cursor: not-allowed !important; border:none;}

#myWinOverlay {position: fixed; display: none; width: 100%;height: 100%;top: 0;left: 0;right: 0;bottom: 0;background-color: rgba(0,0,0,0.9); z-index: 10000;cursor: pointer;}
#myWinContent{display:none;color: #FFFFFF; padding-top: 40%; height: 100%; background: none;}
#giftImage{max-width: 50px; margin-bottom:15px;}

#winFormDiv, #winFormSubmitDiv, #ifNoWinDiv{display: none; padding-bottom: 50px;}
#winFormSubmitDiv{text-align: center;}

#winFormDiv{margin: 15px; text-align: left;}
.winFormTitle{text-align: center; margin-top: 5%; font-size: 12px; font-weight: bolder;}
.formLabel{margin: 10px;}
#win_address{height: auto !important;}
#winFormError{background-color: #FF0000; color: #FFFFFF; width: 100%; text-align: center; padding: 3px; margin: 10px 0px; font-size: 12px; display: none;}

#sorryimage{max-width: 100%; margin: 25px 0px;}

#winFormSubmitDiv{margin-top: 10%; font-size: 22px; font-weight: bolder;}

#termsDiv{position: fixed; bottom: 30px; right: 10px; background: #64FF01; padding: 5px 10px; border-radius: 40px; color: #000000; font-size: 24px; cursor: pointer; z-index: 1001;}
.modal-header{background-color: #000000; color: #FFFFFF;}
.modal-body{font-size: 12px;}
.modal-body>ul>li{padding: 5px 0px;}

.poweredBy{text-align: center; position: fixed; bottom: 0; width: 100%; font-size: 12px;  z-index: 1001;}
.poweredByInner{text-align: center; color: #FFFFFF !important; background: #000000; margin: 0; padding: 3px;}
.poweredBy a{color: #FFFFFF !important; text-decoration: none;}
.footerdiya{max-width: 16px;}

.formContainer{padding-top: 25%;}
.formRangoli{max-width: 75%;}

#mobileForm, #otpForm{margin: 0px 20px; text-align: center; border: 1px solid #000000; padding: 15px; border-radius: 10px; background-color: #FFFFFF; height: 280px;}
#otpForm, #resendOTP{display: none;}
.inputStyle{ width: 95%; height: 40px; margin: 0 auto 15px; padding: 0 30px; text-align: center; font-size: 16px; font-weight: normal; color: #000; display: block; border: 1px solid #f0f0f0; outline: none; background-color: #f0f0f0;text-transform: uppercase;}
.loginModalInnerTitle{font-weight: bolder; margin: 10px 0px;}
.errorBox {visibility:hidden; margin-top: 10px; color:#FF0000; font-weight: bolder; font-size: 12px; text-align: center;}
.modalButton {color: #FFFFFF; background-color: #000000; width: 70%; padding: 7px; margin: 0 auto; text-align: center; font-size: 20px; font-weight: bolder; color: #fff; display: block; cursor: pointer; border:none; border-radius:5px;}
.otpInfo{font-size: 10px; font-weight: bolder; margin: 10px 0px; color: #000000;}
#resendOTPTimer{color: #FF0000; font-size: 14px;}
.branding{margin-top: 10px;color: #000000;}
#resendOTP, .goBack{color: #FF0000 !important; text-decoration: none;}

#formDiyaBottom{position: fixed; bottom: 0; width: 100%; background: url('catalog/singlediya.gif') repeat-x; background-size: contain; height: 30px;}


#landscapeError, #mobileError{width:100%; height:100%; padding: 15px; display:none; position: fixed; top: 0; align-items:center; justify-content:center; z-index:10000; text-align:center; background-color:#EEE;}
.landscapeImage{max-width: 100%; margin-bottom:3%;}
#landscapeError > h3, #mobileError > h3{color:#000000; font-weight:bold;}

@media (min-width: 800px) {
	#logoDiv>img{max-width: 100%;}
	.modal-dialog{margin:auto;}	
	#messageIcon{right: 2%;}
	.modal{top: 0;}
	.crackers{max-width: 15%;}	
	#mobileError{display:block; padding-top: 15%;}
}