/*
* Template Name : Luckii - Responsive Home Page
* Version : 1.0.0
* Created by :  Luckii
* File: Main Css 
*/

h1{
	color:#fff;
	font-weight:800;
	font-size:68px;
	line-height: 70px;
}

img{
	max-width:100%;
}


/*====Header=======*/
.top-header{
	background-color:#0e171f !important;
	border-bottom:3px solid #233443;
	padding: 20px 0px !important;
}

#mySidenav li a{
	font-size:23px;
	font-weight:600;
	color:#fff !important;
}

#mySidenav li a:hover{
	color:#00c1d5 !important;
}

.navbar-nav {
    margin-left: 192px;
    border-bottom: none;
}

.login-btn{
	display: inline;
	background-color: #00c1d5;
	font-size:18px;
	color:#fff;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	border:0px;
	font-weight:400;
	margin-right:5px;
	width:110px !important;
	padding-top:10px;
	padding-bottom:10px;
	
}

.join-now-btn{
	display: inline;
	background-color: #28bd67;
	font-size:18px;
	color:#fff;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	border:0px;
	font-weight:400;
	width:110px !important;
	padding-top:10px;
	padding-bottom:10px;
}

span.mobile-btn {
	display: none;
	}

/*====Slider=======*/
#slider{
	padding-bottom: 0px;	
}

.slider {
        width: 100%;
        margin: 0px auto;
		margin-top: 0px;
		margin-bottom: -7px;
    }

    .slick-slide {
      margin: 0px 0px;
    }

    .slick-slide img {
      width: 100%;
    }

    .slick-prev:before,
    .slick-next:before {
      color: black;
    }


    .slick-slide {
      transition: all ease-in-out .3s;
      opacity: .2;
    }
    
    .slick-active {
      opacity: .5;
    }

    .slick-current {
      opacity: 1;
    }

	.slick-prev {
		left: 48px !important;
		z-index: 99999 !important;
	}

	.slick-next {
	    right: 48px !important;
	    z-index: 99999 !important;
	}

	.slick-prev:before {
    	content:url(../img/prev-arrow.png) !important;
		z-index:1 !important;
	}


	.slick-next:before {
		content:url(../img/next-arrow.png) !important;
		z-index:999 !important;
	}

	.slick-prev, .slick-next {
		top: 50% !important;
	}

	.slick-prev, .slick-next {
		width: 39px !important;
		height: 65px !important;
	}

   .test-bg-2{
		background-image: url("../img/luckii_home_slider2-bg.jpg");
	    height:524px;
		background-position: top center;
	}

	.test-bg-1{
		background-image: url("../img/luckii_home_slider1-bg.jpg");
	    height:524px;
		background-position: top center;
	}

	.test-bg-1 .line-1 , .test-bg-1 .line-2, .test-bg-1 .line-3{
		text-shadow: 0px 0px 0px #000000;
	}

	.slider .col-lg-6{
		float:left;
		padding: 0px;
	}

	.slider-text{
		margin-top:101px;
	}

	.line-1, .line-2, .line-3{
		text-shadow: 0px 0px 20px #000000;
	}

	.slider-main-image{
		margin-top:60px;
	}

	.slider-main-image img{
		max-width:500px;
		min-width:500px;
	}

	.slick-track{
	 background-color: #000;
	}

.line-1{
	color:#fff;
	font-size:54px;
	line-height: 58px;
	text-transform: uppercase;
	font-weight:700;
	display: block;
	text-align: left;
}

.line-2{
	color:#ebae29;
	font-size:85px;
	line-height: 70px;
	text-transform: uppercase;
	font-weight:700;
	display: block;
	text-align: left;
}

.line-2.blue{
	color:#00c1d5 !important;
}

.line-2.orange{
	color:#ebae29 !important;
}

.line-3{
	color:#fff;
	font-size:30px;
	font-weight:600;
	line-height: 50px;
	display: block;
	text-align: left;
}

.line-cta a{
	color:#fff;
	background-color:#28bd67;
	font-size:30px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	padding-top:10px;
	padding-bottom:10px;
	text-align: center;
	display:block;
	max-width:305px;
}



/*====GETTING STARTED=======*/
#getting-started{
	background-color:#0f1922; 
	padding-top: 35px;
    padding-bottom: 35px;
}

.getting-started-title{
	font-size: 39px;
	color:#fff;
	line-height:40px;
	font-weight: 800;
	text-transform: uppercase;
	text-align: center;
}

.blurb{
	margin-top:-10px;
}

.register-title .circle{
	display: inline-block;
    border-radius: 50%;
    width: 74px;
    height: 74px;
    padding: 7px;
    background: #0f1922;
    text-align: center;
    color: #fff;
    font-weight: bold;
    font-size: 45px;
    line-height: 44px;
    margin-right: 11px;
    float: left;
    margin-top: 5px;
}

.register-title .circle.orange-border{
	border: 7px solid #ebae29;
}

.register-title .circle.blue-border{
	border: 7px solid #00c1d5;
}

.register-title .circle.red-border{
	border: 7px solid #d43238;
}

.register-title strong{
	font-size: 23px;
    line-height: 24px;
    font-weight: 800;
    display: block;
    letter-spacing: -1px;
}

.register-title strong.orange-text{
	color:#ebae29;
}

.register-title strong.blue-text{
	color:#00c1d5;
}

.register-title strong.red-text{
	color:#d43238;
}

.register-title em{
	font-size:14px;
	color:#bababa;
	line-height: 16px !important;
	margin-top:10px;
	display: block;
	font-style: normal;
}

/*====REEL FUN=======*/

#reel-fun{
	text-align: center;
	background-color:#192530;
	padding-top:88px;
	padding-bottom:88px;
	background-image:url("../img/horse-shoe-bg.jpg");
	background-repeat: no-repeat;
}

#reel-fun em{
	font-size:35px;
	line-height:39px;
	color:#00c1d5;
	font-style: normal;
	font-weight:300;
	
}

/*====WHY CHOOSE LUCKII=======*/
#choose-luckii{
	text-align: center;
	background-color:#0a1015;
	padding-top:88px;
	padding-bottom:140px;
	background-image:url("../img/why-choose-bg.jpg");
	background-position: top center;
	background-repeat: no-repeat;
	border-top:9px solid #233443;
	border-bottom:9px solid #233443;
	
}

#choose-luckii h3{
	font-size:24px;
	color:#00c1d5;
	font-weight:800;
}

#choose-luckii span{
	font-size:16px;
	color:#fff;
	line-height: 20px;
}

#choose-luckii .mobile-phone{
	margin-top:62px;
}

#choose-luckii .left-info{
	margin-top:76px;
}


#choose-luckii .right-info{
	margin-top:76px;
}

#choose-luckii .head-margin{
	margin-top:60px;
}

/*====TOTAL JACKPOTS=======*/

#jackpots{
	text-align: center;
	background-color:#192530;
	padding-top:88px;
	padding-bottom:88px;
	background-image:url("../img/horse-shoe-bg.jpg");
	background-repeat: no-repeat;
}

#jackpots .total-jackpot{
	font-size:58px;
	color:#d43238;
	font-weight:800;
	line-height:62px;
}

#jackpots .total-jack-amount{
	font-size:123px;
	color:#fff;
	font-weight:800;
	line-height: 123px;
}

#jackpots .jackpot-text{
	font-size:39px;
	color:#00c1d5;
	font-weight: 300;
	line-height:43px;
}

#jackpots .btn{
margin-top:25px;
}

#jackpots .btn a{
	font-size:31px;
	color:#fff;
	font-weight:300;
	background-color: #28bd67;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	padding: 15px 72px;
}

#jackpots .small-text-link a{
	color:#fff;
	text-decoration: underline !important;
	font-size:14px;
}



/*====FOOTER=======*/
.footer{
	background-color:#000;
	text-align: left;
	padding-top:43px;
	padding-bottom:43px;
}

.footer .logo img{
	vertical-align: center;
	padding-top:44px;
}

.footer .small-grey{
	font-size:12px;
	color:#585858;
	line-height:16px;
}

.footer .links a{
	color:#bababa;
	font-size:14px;
	line-height:18px;
}

.footer .payment-social img{
	margin-right:10px;
}


/*====RESPONSIVE=======*/

@media (max-width: 1199px) {
	.navbar-nav {
    	margin-left: 107px;
	}
	
	.slider-main-image img {
		max-width: 430px;
		min-width: 430px;
	}
	
	.slider-main-image {
    	margin-top: 91px;
	}
}

@media (max-width: 1024px) {
	.navbar-nav {
    	margin-left: 100px !important;
	}
	
	.static-text {
    	margin-right: 60px;
	}
	
}

@media (max-width: 991px) {
	
	.top-header {
   	 	padding: 10px 0px !important;
	}
	
	.navbar-white .navbar-toggler {
		color: #393f4f !important;
		float: left;
		width: 100;
		text-align: left;
		margin-top: -54px;
		margin-left: 0px;
	}
	
	a.navbar-brand.logo.text-uppercase {
		display: block;
		width: 100%;
		margin-left: 68px;
	}
	
	.mdi-menu:before {
		content: "\F35C";
		font-size: 45px;
		color: #fff;
	}
	
	.container{
	    width: 100%;
    	max-width: 100%;
	}
	
	.navbar-custom>.container {
    	width: 100%;
	}
	
	.navbar-nav {
		margin-left: 0px !important;
		padding-left: 20px;
		border-top: 3px solid #233443;
		margin-top: 15px;
	}
	
	.slider .col-lg-6{
      	margin-top: 0px;
		float: none;
    	padding: 0px;
    	text-align: center;
	}
	
	.slider-main-image img {
		max-width: 360px;
		min-width: 360px;
		margin: 0 auto;
	}
	
	.line-1, .line-2, .line-3{
		text-align: center;
	}
	
	.line-1 {
		font-size: 40px;
		line-height: 36px;
	}
	
	.line-2.blue br{
		display: none;
	}
	
	.line-2.orange br{
		display: none;
	}
	
	.line-2 {
		color: #ebae29;
		font-size: 56px;
		line-height: 56px;
	}
	
	.line-3 {
		font-size: 26px;
    	line-height: 30px;
	}
	
	.line-cta a {
		font-size: 30px;
		padding-top: 5px;
		padding-bottom: 5px;
		text-align: center;
		display: block;
		max-width: 250px;
		margin:0 auto;
		margin-top:10px;
	}
	
	.slick-next {
    	right: 32px !important;
		z-index: 99999 !important;
	}
	
	.slick-prev {
    	left: 32px !important;
		z-index: 99999 !important;
	}
	
	#jackpots .total-jack-amount {
		font-size: 90px;
		color: #fff;
		font-weight: 800;
		line-height: 80px;
	}
	
	span.mobile-btn {
		float: right;
		position: absolute;
		right: 23px;
		display: inline-block;
		top: 16px;
		z-index: 999;
	}
	
	.nav.navbar-nav.navbar-right{
		display:none !important;
	}
	
	.getting-started-title {
		flex: 0 0 100%;
		max-width: 100%;
		margin-bottom: 26px;
	}
	
	.getting-started-title br{
		display: none;
	}
	
	
	.register-title strong {
    	padding-top: 19px;
	}
	
	.register-title{
		flex: 0 0 33%;
    	max-width: 33%;
	}
	
	.register-title .circle {
		margin-top: 22px;
		margin-bottom: 46px;
	}
	
	#reel-fun {
    padding-top: 44px;
    padding-bottom: 44px;
	}
	
	#choose-luckii .left-info {
    	margin-top: 28px;
	}
	
	#choose-luckii .head-margin {
    	margin-top: 28px;
	}
	
	#choose-luckii .mobile-phone {
    margin-top: 28px;
	}
	
	#choose-luckii .right-info {
    	margin-top: 28px;
	}
	
	#choose-luckii {
		padding-bottom: 44px;
		padding-top: 44px;
	}
	
	#choose-luckii br{
		display: none ;
	}
	
	#choose-luckii h1{
		margin-bottom:44px !important;
	}
	
	#jackpots {
		padding-top: 44px;
		padding-bottom: 34px
	}
	
	#jackpots .jackpot-text {
    	font-size: 32px;
		line-height: 36px;
	}
	
	#jackpots .total-jackpot {
		font-size: 48px;
		line-height: 31px;
	}
	
	.footer {
		background-color: #000;
		text-align: center;
	    padding-top: 0px;
        padding-bottom: 30px;
	}
	
	.col-lg-3.logo {
		margin-bottom: 20px;
		text-align: center;
	}
	
	.join-now-btn, .login-btn  {
		font-size: 16px;
		width: 120px !important;
    }
	
	.test-bg {
    background-image: url(../img/slider-image-1.jpg);
    height: 524px;
    background-position: 38% center;
	}
	
	
	
	
}

@media (max-width: 767px) {
	
	.test-bg .float-right{
		float: none !important;
		margin-top: 150px;
	}
	
	.line-1, .line-2, .line-3, .line-cta{
		text-align: center;
	}
	
	.line-cta a{
		margin: 0 auto;	
	}
	
	.test-bg {
		height: 524px;
		background-position: 25% center;
	}
	
	.line-1{
		text-shadow: 0px 0px 20px #000000;	
	}
	
	.line-2 {
		font-size: 50px;
		line-height: 50px;
		text-shadow: 0px 0px 20px #000000;	
	}
	
	.line-2 br{
		display: none;
	}
	
	.line-3 {
    font-size: 25px;
    margin-top: 0px;
    margin-bottom: 15px;
    text-shadow: 0px 0px 20px #000000;
    line-height: 25px;

	}
	
	.register-title {
		flex: 0 0 100%;
		max-width: 100%;
	}
	
	.register-title strong {
   	 	padding-top: 34px;
	}	
	
	.register-title .circle {
    	margin-top: 22px;
		margin-bottom: 22px;
	}
	
	section#getting-started .container {
    	max-width: 420px;
	}
	
	h1 {
		font-size: 50px;
		line-height: 50px;
	}
	
	#reel-fun em {
		font-size: 28px;
		line-height: 28px;
	}
	
	#jackpots .total-jack-amount {
		font-size: 80px;
		line-height: 80px;
	}
	
}

@media (max-width: 600px) {
	
	.navbar-brand.logo.text-uppercase img {
   		 width: 103px;
	}
	
	.navbar-white .navbar-toggler {
		margin-top: -45px;
	}
	
	.line-1 {
		font-size: 39px;
		line-height: 39px;
	}
	
	.line-2 {
		font-size: 38px;
		line-height: 38px;
	}
	
	.line-3 {
		font-size: 25px;
		line-height: 30px;
	}
	
	.login-btn, .join-now-btn  {
		font-size: 15px;
		width: 90px !important;
	}
	
	span.mobile-btn {
    	top: 18px;
		right: 17px;
	}
	
	a.navbar-brand.logo.text-uppercase {
    	padding-top: 10px;
	}
	
	#jackpots .total-jackpot {
		font-size: 36px;
		line-height: 29px;
	}
	
	#jackpots .total-jack-amount {
		font-size: 41px;
		line-height: 31px;
	}
	
	#jackpots .jackpot-text {
		font-size: 22px;
		line-height: 22px;
	}
	
	#jackpots .btn a {
    	padding: 15px 42px;
	}
	
	#jackpots .btn {
    	margin-top: 0px;
	}
	
	.join-now-btn, .login-btn  {
		font-size: 14px;
		width: 100px !important;
    }
	
	.test-bg {
    	background-position: 27% center;
	}
	
	h1 {
		font-size: 40px;
		line-height: 40px;
	}
	
	#reel-fun em {
		font-size: 23px;
		line-height: 23px;
	}
	
	.extra-margin{
		margin-top:-20px;
	}
}

@media (max-width: 400px) {
	
	.navbar-brand.logo.text-uppercase img {
    	width: 65px;
	}
	
	.top-header {
    	padding: 5px 0px !important;
	}
	
	span.mobile-btn {
    	top: 15px;
	}
	
	a.navbar-brand.logo.text-uppercase {
    	margin-left: 55px;
	}
	
	.mdi-menu:before {
    	font-size: 37px;
	}
	
	#mySidenav li a {
		font-size: 18px;
		color: #fff !important;
	}
	
	.login-btn, .join-now-btn {
		font-size: 12px;
		width: 85px !important;
		padding-top: 5px;
    	padding-bottom: 5px;
	}
	
	.login-btn {
    	margin-right: 0px !important;
		width:60px !important;
	}
	
	.join-now-btn {
		width: 85px !important;
	}
	
	.navbar-white .navbar-toggler {
    	margin-top: -39px;
	}
	
	.slider-main-image img {
		max-width: 290px;
		min-width: 290px;
		margin: 0 auto;
		margin-top:40px;
	}
	
	.line-1 {
		font-size: 33px;
		line-height: 33px;
	}
	
	.line-2 {
		font-size: 34px;
		line-height: 34px;
	}
	
	.line-3 {
    	font-size: 22px;
	}
}

