/*-----------------------------------------------------------------------------------
    
    Template Name: LotoGame - Digital Lotto HTML Template
    Template URI: http://rockstheme.com
    Description: This is html5 template
    Author: Rocks_theme
    Author URI: http://rockstheme.com
    Version: 1.0

-----------------------------------------------------------------------------------*/

    /*-----------------------------------------------------------------------------------  
     CSS INDEX
    ===================

    1. Theme Default CSS (body, link color, section etc)
    2. Header Top Area
    2.1 Header Bottom Area 
    2.2. Sticky Header Area
    2.3. Mobile Menu Area
    3. Intro Area
    4. How to Area
    5. About Area
    6. Lottery Area Css
    7. Why choose Area Css
    8. Latest Winner area
    9. Payment History area
    10. Blog Area
    11. Reviews Area
    12. Subscribe Area
    13. Footer Area
    14.	Home-2  CSS
    15. Breadcumbs Area
    16. Affiliate page area
    `17.Lottery Number area
    18. FAQ  Area
    19. Blog Sidebar Area
    20. Blog Details
    21.	Contact Us page
    22. Terms & Conditions
    23. Error page area
    24. Login And Register page
    25. Animation area
-----------------------------------------------------------------------------------*/
/*----------------------------------------*/
/*  Google Fonts
/*----------------------------------------*/
@import url('https://fonts.googleapis.com/css?family=Nunito:300,400,600,700,800&display=swap');

   .CopyrightNotice{
    opacity:0;
    height:0px;
    display: block;
   } 

  .lds-ring {
    display: inline-block;
    position: absolute;
    width: 80px;
    height: 80px;
    left: 50%;
    top: 50%;
    margin-top: -40px;
    margin-left: -40px;
  }
  .lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 64px;
    height: 64px;
    margin: 8px;
    border: 8px solid #fff;
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: #fff transparent transparent transparent;
  }
  .lds-ring div:nth-child(1) {
    animation-delay: -0.45s;
  }
  .lds-ring div:nth-child(2) {
    animation-delay: -0.3s;
  }
  .lds-ring div:nth-child(3) {
    animation-delay: -0.15s;
  }
  @keyframes lds-ring {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
  


.result table td{
    text-align:center;
}
.result span{
    color: #a10000;
    font-size: 14px;
    line-height: 16px;
}
.result thead th{
    background-color:#2E2E2D;
    color:#ffffff;
    text-align:center;
}
.result tr:hover{
    background-color:#05833e;
    color:#ffffff;
}
.result td{
    font-weight:bold;
}


.fa-info{
    color:#ffffff;
    margin-right: 5px;
    font-size:20px;
}
.ellipsis {
    width: 200px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.expiry {
    text-align: center;
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #00000082;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 30px;
    font-size: 28px;
    line-height: 32px;
    z-index: 10;
    color: #ffffff;
}
table{
    width: 100%;
    margin: 20px 0;
}
td, th {
    padding: 10px;
    border: 2px solid #f1cc94;
}

.faq{
    margin-bottom: 40px;
}
.faq h4 {
    margin-bottom: 15px;
}

.faq ul {
    overflow: hidden;
}
.faqlist li {
    width: 50%;
    float: left;
    padding: 0 20px;
    font-size: 14px;
}
.fa-question:before{
    margin-left: -15px;
}

.tagcloud a {
    display: block;
    float: left;
    margin-right: 4px;
    margin-bottom: 4px;
    padding: 3px 6px;
    border: 1px solid #E5E5E5;
    font-size: 13px !important;
    color: #e3e3e3;
    border-radius: 5px
}
.tagcloud a:hover {
    background:#2E2E2D;
    color:#ffffff;
}
/*----------------------------------------*/
/*  1.  Theme default CSS

/*----------------------------------------*/

html, body {
	height: auto;
    background-color: #000000;
   
}
.floatleft {
	float:left;
}
.floatright {
	float:right;
}
.alignleft {
	float:left;
	margin-right:15px;
	margin-bottom: 15px;
}
.alignright {
	float:right;
	margin-left:15px;
	margin-bottom: 15px;
}
.aligncenter {
	display:block;
	margin:0 auto 15px;
}
a:focus {
	outline:0px solid;
}
img {max-width:100%;
	height:auto;
}
.fix {
	overflow:hidden;
}
p {
	margin:0 0 30px;
    color: #ffffff;
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'Nunito', sans-serif;
	margin: 0 0 15px;
	color: #ffffff;
    font-weight: 700;
}
h1{
	font-size: 48px;
	line-height: 50px;
		
}
h2{
	font-size: 38px;
	line-height: 44px;
		
}
h3{
	font-size: 30px;
	line-height: 38px;
		
}
h4{
	font-size: 24px;
	line-height: 34px;
		
}
h5{
	font-size: 20px;
	line-height: 28px;
		
}
h6{
	font-size: 16px;
	line-height: 26px;
		
}
a {
	transition: all 0.3s ease 0s;
	text-decoration:none;
    color: #cc9837;
}

a:active, a:hover {
  outline: 0 none;
}
a:hover, a:focus {
    color: #26ade3;
    text-decoration: none;
}
body {
	color: #cfcfcf;
    font-family: 'Nunito', sans-serif;
	font-size: 16px;
	text-align: left;
	overflow-x: hidden;
	line-height: 26px;
}
#scrollUp {
    bottom: 40px;
    font-size: 20px;
    line-height: 48px;
    right: 30px;
    width: 44px;
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    color: #fff;
    text-align: center;
    height: 44px;
    border-radius: 22px;
    border:1px solid #26253f;
    transition: .8s;

}
#scrollUp:hover {
    background: linear-gradient(to right,#3142df 0,#273299 15%,#4f59b3 30%,#3142df 55%,#3142df 100%);
   
}
.clear{
	clear:both;
}
.color{
    color: #26ade3;
}
ul{
	list-style: outside none none;
	margin: 0 0 30px;
	padding: 0;
}
input, select, textarea, input[type="text"], input[type="date"], input[type="url"], input[type="email"], input[type="password"], input[type="tel"], button, button[type="submit"] {
	-moz-appearance: none;
	box-shadow: none !important;
}
input:focus, textarea:focus, select:focus {
    outline: none;
}
div#preloader { 
	position: fixed;
	left: 0; 
	top: 0; 
	z-index: 99999;
	width: 100%;
	height: 100%;
	overflow: visible;
    
}
.navbar-collapse {
    padding-left: 0px;
}
::-moz-selection {
    background: #26ade3;
    text-shadow: none;
}
::selection {
    background: #26ade3; 
    text-shadow: none;
}
.bg-color{
    background:#2E2E2D;
}
.bg-color-2{
    background:#e8faed;
}
.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #2a354e;
    padding: 0.2em 0;
}
.area-padding{
	padding: 60px 0px;
}
.area-padding-2{
    padding: 60px 0px 70px;

}
.area-padding-3{
    padding: 70px 0px 100px;
}
.area-padding-4{
    padding: 100px 0px 50px;
}
.section-headline {
    padding-bottom: 40px;
    position: relative;
}
.section-headline h3 {
    font-size: 40px;
    text-transform: capitalize;
    line-height: 48px;
    color:#ffffff;
}
.section-headline p {
    max-width: 600px;
    font-size: 17px;
    margin: 0 auto;
}
.white-headline h3{
   color:#fff; 
}
.section-headline h4 .color {
    color: #26ade3;
    font-weight: 600;
}
.mar-row{
    margin-top: 50px;
}
.simple-text{
    font-weight: 400;
}
.color-text{
    color: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%)
}
/*--------------------------------*/
/*  2. Header top Area
/*--------------------------------*/
.topbar-left ul li {
    display: inline-block;
}
.topbar-area {
    background:#2E2E2D;
}
.topbar-left ul li a {
    color: #dbeee1;
    display: block;
    margin-right: 20px;
    padding: 11px 0;
    text-decoration: none;
    font-size: 12px;
    letter-spacing: 0.60px;
}
.topbar-left ul li a i {
    color: #dbeee1;
    font-size: 16px;
    padding-right: 7px;
}
.topbar-left ul li:last-child a{
	margin-right:0px;
}
.topbar-right {
    float: right;
}
.topbar-right ul li {
    display: inline-block;
    position: relative;
}
.topbar-right>ul>li>a {
    color: #dbeee1;
    display: block;
    padding: 12px 30px 10px 0px;
    position: relative;
    font-size: 12px;
}
.topbar-right ul li ul {
    background: #292761;
    left: 0;
    position: absolute;
    top: 100%;
    width: 130px;
    z-index: 9999999;
    padding: 10px 15px;
    opacity: 0;
    transform: scaleY(0);
    transform-origin: 0 0 0;
    transition: all 0.4s ease 0s;
    visibility: hidden;
}
.topbar-right >ul>li > ul a {
    color: #dbeee1;
    font-size: 13px;
}
.topbar-right ul li:hover ul {
    visibility: visible;
    opacity: 1;
    transform: scaleY(1);
}
.topbar-right> ul>li>a::after {
    color: #dbeee1;
    content: "\e64b";
    font-family: themify;
    font-size: 12px;
    position: absolute;
    right:15px;
    top: 13px;
}
.topbar-right> ul>li:last-child a::after{
    display: none;
}
.topbar-right> ul>li:last-child a{
    padding-right: 0px;
}
.topbar-right img {
    margin-right: 5px;
}
/*----------------------------------------*/
/*  2.1 Header Bottom Area 
/*----------------------------------------*/
.header-one {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    z-index: 999;
}
.header-area{
	background:#000000;
}
.logo {
    display: block;
}
.logo img{
   max-height: 40px;
}
.logo a {
    display: inline-block;
    height: auto;
    padding: 25px 0;
}
.main-menu ul.navbar-nav li {
    float: left;
    position: relative;
}
.main-menu ul.navbar-nav li a {
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    padding: 35px 12px;
    text-transform: uppercase;
    position: relative;
}
.main-menu > ul.navbar-nav >li >a::before {
    position: absolute;
    content: "";
    left: 16px;
    top: 0px;
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    width:0;
    transition: 0.4s;
    opacity: 0;
}
.main-menu > ul.navbar-nav >li >a:hover::before {
    width:60%;
    transition: 0.4s;
    opacity: 1;
}
.main-menu ul.navbar-nav li a:hover{
	color: #26ade3;
}
.main-menu ul.navbar-nav li.active a:focus {
    color: #fff;
}
.main-menu ul.navbar-nav li.active a {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #26ade3;
    position: relative;
    z-index: 9999999;
}
.navbar {
    border: medium none;
    margin-bottom: 0;
}
.navbar-default {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
}
.main-menu ul.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    background: none;
    color:#fff;
}
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
    background-color: transparent;
    color: #fff;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background: none;
}
.main-menu ul.nav li ul.sub-menu {
    background: #000000;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 115%;
    transition: all 0.3s ease 0s;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
    visibility: hidden;
    width: 200px;
    z-index: -99;
	padding: 10px 0px;
    border-radius: 2px;
}
.pages {
    position: relative;
}
.navbar.navbar-default {
    float: right;
}
.main-menu ul.nav li ul.sub-menu li {
    padding: 0;
    position: relative;
    width: 100%;
}
.main-menu ul.nav li:hover ul.sub-menu{
    top:100%;
    opacity:1;
    z-index:999;
    visibility:visible;
}
.main-menu ul.nav li ul.sub-menu li a {
    color: #ffffff;
    display: block;
    font-size: 14px;
    padding: 5px 20px;
}
.main-menu ul.nav li ul.sub-menu li a span{
    color: #26ade3;
}
.main-menu ul.nav li:hover ul.sub-menu li a:hover{
    color:linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
}
.header-right-link {
    float: right;
    width: 170px;
    padding: 30px 0px;
    text-align: right;
}
.s-menu {
    padding: 10px 20px;
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    color: #fff;
    transition: 0.4s;
    font-size: 15px;
    font-weight: 700;
    border-radius: 20px;
    text-transform: uppercase;
}
.s-menu:hover {
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    background: transparent;
	color:linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    transition: 0.4s;
}
.header-area.stick  .header-right-link {
    padding: 27px 0px;
}
/*--------------------------------*/
/* 2.2. Sticky Header Area
/*--------------------------------*/
.header-area.stick {
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999999;
    background: #000000;
}
.header-area.stick .logo a {
    display: inline-block;
    height: auto;
    padding: 17px 0;
}
.header-area.stick .main-menu ul.navbar-nav li a {
    padding: 30px 15px;
    color: #ffffff;
}
.header-area.stick .main-menu ul.nav li ul.sub-menu li a {
    color: #ffffff;
    display: block;
    padding: 5px 15px;
}
.header-area.stick .main-menu ul.navbar-nav li a:hover,
.header-area.stick .main-menu ul.nav li ul.sub-menu li a:hover{
    color: #26ade3;
}
/*----------------------------------------*/
/*  2.3. Mobile Menu Area
/*----------------------------------------*/

.mobile-blue{
    background-color: #2E2E2D;
}

.mean-container a.meanmenu-reveal{
    padding:0px;
}
.mobile-menu-area {
    background: #2E2E2D none repeat scroll 0 0;
    padding: 15px 0px 5PX;
}
.mean-container .mean-bar::after {
    content: "";
    font-size: 21px;
    left: 5%;
    position: absolute;
    top: 12px;
    text-transform: uppercase;
    font-weight: 500;
}
.mean-container a.meanmenu-reveal:hover {
    color:linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%)
}
.mean-container .mean-nav ul li li a{
    color: #ffffff;
}
.mean-container .mean-nav ul li a.mean-expand,.mean-container .mean-nav,.mean-container .mean-nav ul li{
    background: #2E2E2D;
}
.mean-container .mean-nav ul {
    list-style-type: none;
    margin: 35px 0 0;
    padding: 0;
    width: 100%;
}
.mean-container .mean-nav ul li a {
    background: #2E2E2D none repeat scroll 0 0;
    color: #ffffff;
    display: block;
    float: left;
    font-size: 15px;
    font-weight: 600;
    margin: 0;
    padding: 13px 10px;
    text-align: left;
    text-decoration: none;
    text-transform: capitalize;
    width: 90%;
}
.mean-nav ul li.mean-last {
    margin-bottom: 20px;
}
.mean-container .mean-nav ul li a.mean-expand {
    color: #ffffff;
    line-height: 17px;
}
.mean-container .mean-nav ul li {
    width: 99.7%;
}
/*----------------------------------------*/
/*  3. Intro Area max-width: 500px;
/*----------------------------------------*/
.owl-carousel .owl-item img{
    margin: auto;
    
}

.intro-home{
	position: relative;
	overflow: hidden;
    z-index: 1;
    padding-top: 90px;

}
/*.intro-home::after {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background: url(img/background/bg1.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    content: "";
    opacity: 0.9;
}*/
.display-table{
	width: 100%;
	height: 100%;
	display: table;
}
.display-table-cell{
	width: 100%;
	height: 100%;
	display: table-cell;
	vertical-align: middle;
}
.intro-content {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 0;
    width: 100%;
    height: auto;
    margin-top: -80px;
}
.slider-content {
    position: relative;
}
.best-title {
    font-size: 18px;
    color: #26ade3;
    display: inline-block;
    margin-bottom: 20px;
    text-transform: uppercase;
}
.layer-1 h2 {
    color: #ffffff;
    font-size: 44px;
    font-weight: 700;
    line-height: 54px;
    max-width: 640px;
    margin-bottom: 20px;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.layer-2 p {
    font-size: 19px;
    letter-spacing: 0.50px;
    color:#cfcfcf;
    max-width: 640px;
}
.ready-btn {
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 20px;
    font-weight: 700;
    margin-top: 20px;
    padding: 12px 30px;
    text-align: center;
    text-transform: capitalize;
    transition: all 0.4s ease 0s;
    border-radius: 20px;
}
.ready-btn:hover{
    color: #26ade3;
    background:transparent;
    transition: all 0.4s ease 0s;
}
/*--------------------------------*/
/* 4.How to Area
/*--------------------------------*/
.how-to-area {
    padding: 100px 0px 160px;
}
.all-how{
	margin-bottom:60px;
}
.single-how {
    text-align: center;
    z-index: 1;
    overflow: hidden;
    transition: 0.4s;
    padding: 40px 30px;
    border-radius: 12px;
    background: #fff;
    position: relative;
}
.how-wel {
    padding: 20px 0px 0px;
}
.how-img {
    display: inline-block;
}
.big-icon img {
    border-radius: 5px;
    width: 100px;
    height: 100px;
}
.how-content p {
    margin-bottom: 0px;
    color: #333333;
}
.how-content h4 {
    display: inline-block;
    font-size: 24px;
    margin-bottom: 0;
    padding: 0 0 10px;
    font-weight: 600;
    color: #000000;
}
.single-how.first-item,
.single-how.thired-item{
    position: relative;
    top: 60px;
}
.h-number {
    position: absolute;
    left: 15px;
    top: 15px;
    line-height: 40px;
    color: #ccc;
    z-index: 2;
    font-size: 40px;
    font-weight: 700;
    opacity: 0.5;
}
/*--------------------------------*/
/* 5.About Area
/*--------------------------------*/
.about-area {
    position: relative;
}
.about-content {
    text-align: left;
    margin-top: 20px;
}
.about-content .section-headline {
    padding-bottom: 0px;
}
.about-company {
    margin-top: 15px;
    display: block;
    overflow: hidden;
}
.single-about {
    width: 50%;
    float: left;
}
.about-content .section-headline p {
    font-size: 16px;
}
.about-content.format p img{
    max-width: 360px;
    float: left;
}

.about-content h3{
    margin-bottom:10px;
}

.about-text {
    font-size: 18px;
    line-height: 26px;
    position: relative;
    padding-left: 30px;
    display: block;
    margin-top: 10px;
}
.single-about p{
    padding-left: 30px;
    padding-right: 30px;
    margin-bottom: 40px;
}
.about-text::before {
    position: absolute;
    content: "";
    border: 2px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    left: 0;
    top: 8px;
    width: 11px;
    height: 11px;
    border-radius: 50px;
}
.last-content{
    margin-bottom: 0px !important;
}
.about-video{
    position: relative;
}
.video-content {
    width: 100%;
    height: auto;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 9;
    margin-top: -50px;
}
.video-play.vid-zone {
    border-radius: 100px;
    display: inline-block;
    border: 1px solid #2E2E2D;
    text-align: center;
    height: 80px;
    width: 80px;
    line-height: 77px;
    position: relative;
    font-size: 40px;
    background: transparent;
}
.video-play::before {
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-name: popcircle;
    animation-name: popcircle;
    border: 1px solid #2E2E2D;
    border-radius: 100px;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.video-play.vid-zone i {
    color: #2E2E2D;
    margin-left: 5px;
}
/*----------------------------------------
  6. Lottery Area Css
----------------------------------------*/
.single-ticket {
    border: 1px solid #f8ce87;
    position: relative;
    display: block;
    overflow: hidden;
    padding: 30px 20px;
    text-align: center;
    background: #0a1221;
    border-radius: 8px;
    margin-bottom: 30px;
    
}
.ticket-rate {
    position: absolute;
    left: 0px;
    top: 10px;
    background: #e62e7c;
    color: #fff;
    font-weight: 600;
    font-size: 18px;
    padding: 2px 15px;
    line-height: 26px;
    border-radius: 0px 3px 3px 0px;
}
.lettery-carousel .col-md-4{
    width: 100%;
}
.win-price {
    display: block;
    font-size: 18px;
    margin-bottom: 15px;
    text-transform: uppercase;
    font-weight: 600;
}
.win-money {
    display: block;
    font-size: 20px;
    margin-bottom: 15px;
    text-transform: uppercase;
    font-weight: 700;
}
.ticket-content{
    display: flex;
    flex-wrap: wrap;
}
.ticket-image {
    display: block;
}
.ticket-image img {
    border-radius: 5px;
    margin: 0 auto 10px;
}
.ticket-text {
    overflow: hidden;
    display: block;
    padding-bottom: 10px;
}
.ticket-name {
    text-transform: uppercase;
    font-size: 16px;
    margin-bottom: 5px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    line-height: 18px;
    overflow: hidden;
}
.ticket-number {
    font-size: 24px;
    font-weight: 700;
    line-height: 34px;
    color: #fff;
    display: block;
    margin-bottom: 15px;
}
.draw {
    display: block;
    font-size: 12px;
    margin-bottom: 20px;
    text-transform: uppercase;
    font-weight: 700;
    line-height: 16px;
}
.ticket-btn {
    text-align: center;
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    color: #fff;
    background:linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    padding: 8px 15px;
    border-radius: 20px;
    transition: 0.4s;
    font-size: 15px;
    font-weight: 600;
    margin-top: 10px;
    line-height: 36px;
}
.ticket-btn:hover{
    background:transparent;
    transition: 0.4s;
    color:linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
}
.lettery-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-prev, 
.lettery-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-next {
    color: #26ade3;
    font-size: 18px;
    margin-top: -20px;
    position: absolute;
    top: 50%;;
    text-align: center;
    line-height: 42px;
    opacity: 0;
    border:1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    width: 40px;
    height: 40px;
	border-radius: 50%;
}
.lettery-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-prev{
    left: 10%;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    -ms-transition: 0.4s;
}
.lettery-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-next {
    right: 10%;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    -ms-transition: 0.4s;
}
.lettery-carousel.owl-carousel.owl-theme:hover .owl-controls .owl-nav div.owl-next{
    right: 2%;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    -ms-transition: 0.4s;
    opacity: 1;
}
.lettery-carousel.owl-carousel.owl-theme:hover .owl-controls .owl-nav div.owl-prev{
    left: 2%;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    -ms-transition: 0.4s;
    opacity: 1;
}
.lettery-carousel.owl-carousel.owl-theme:hover .owl-controls .owl-nav div.owl-next:hover,
.lettery-carousel.owl-carousel.owl-theme:hover .owl-controls .owl-nav div.owl-prev:hover{
    color:#fff;
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
}
/*----------------------------------------
  7. Why choose Area Css
----------------------------------------*/
.support-services {
    padding: 30px;
    border: 1px solid #26ade3;
    border-radius: 20px;
    text-align: center;
    margin-bottom: 20px;
    background-color: #3c4c52;
    border-radius: 12px;
    height: 100%;
}
.support-images {
    width: 120px;
    height: 120px;
    margin-bottom: 20px;
    border-radius: 10px;
}
 .support-content h4 {
    font-size: 24px;
    text-transform: capitalize;
    padding-bottom: 0px;
    letter-spacing: 0.60px;
    line-height: 28px;
}
.support-content p {
    margin-bottom: 0px;
}
/*----------------------------------------
  8. Latest winner
----------------------------------------*/
.winner-results {
    padding: 40px;
    border: 1px solid #f5f5f5;
    overflow: hidden;
    margin-bottom: 30px;
    border-radius: 4px;
    background: #fff;
    position: relative;
}
.draw-date {
    position: absolute;
    right: -50px;
    top: 22px;
    background: #e62e7c;
    width: 180px;
    text-align: center;
    height: 34px;
    line-height: 34px;
    color: #fff;
    transform: rotate(45deg);
    z-index: 2;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 700;
}
.winner-content h4 {
    text-transform: capitalize;
}
.winner-images {
    float: left;
    width: 30%;
}
.winner-content {
    padding-left: 30px;
    float: left;
    width: 70%;
}
.winning-number {
    display: block;
    margin-bottom: 20px;
}
.winning-number li {
    display: inline-block;
}
.winning-number li a {
    display: block;
    color: #fff;
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    border-radius: 20px
    font-size: 20px;
    font-weight: 700;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    margin: 0px 1px;
}
.jackpot {
    font-weight: 700;
    font-size: 24px;
    display: block;
}
/*----------------------------------------*/
/*  9.Payment History area
/*----------------------------------------*/
.deposite-content {
    position: relative;
}
.deposite-content table {
  border-collapse: collapse;
  width: 100%;
}
.deposite-content th {
    text-align: left;
    padding: 8px 10px 8px 30px;
    height: 80px;
    text-transform: uppercase;
}
.deposite-content td{
    text-align: left;
    padding: 8px 10px 8px 30px;
    height: 80px;
}
.deposite-content tr:nth-child(even) {
  background-color: #f4f6f7;
}
.diposite-box {
    width: 100%;
    margin: 0 auto;
    background: #e5edf1;
    position: relative;
}
.diposite-box h4 {
    display: inline-block;
    font-size: 26px;
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    padding: 10px 30px;
    margin-bottom: 25px;
    border-radius: 20px;
    color:#fff;
}
.diposite-box span {
    float: right;
    font-size: 28px;
    color: #fff;
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    padding: 10px 20px;
    border-radius: 20px;
    line-height: 32px;
}
.deposite-table td img {
    margin-right: 15px;
    border-radius: 50%;
}
.self-number li {
    display: inline-block;
}
.deposite-table .self-number li a {
    display: block;
    color: #fff;
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    border-radius: 50%;
    font-size: 13px;
    font-weight: 700;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    margin: 0px 1px;
}
/*----------------------------------------*/
/*  10. Blog Area
/*----------------------------------------*/
.blog-image{
  overflow: hidden;
    display: block;
}
.image-scale {
    position: relative;
    transform: scale(1);
    display: block;
    transition: 0.5s;
}
.image-scale::after{
    position: absolute;
    content: "";
    background: rgba(0,46,91,0.10);
    width: 100%;
    height: 100%;
    left:0;
    top:0;
}

.blog-grid{
    display: flex;
    align-items: stretch;
}
.blog-content h3,.blog-content h4{
    margin-bottom:0px
}
.blog-content p{
    margin-bottom:15px
}
.blog-content p a{
    font-weight:bold;
    font-size:14px;
    text-decoration: underline;
}
.blog-content a h4 {
    font-size: 14px;
    font-weight: 600;
    color: #ffffff;
    line-height: 18px;
    margin-bottom: 0px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
}
.blog-category span {
    text-transform: uppercase;
    font-size: 13px;
    color: #26ade3;
    font-weight: 700;
}

.blog-cover {
    text-align: center;
    overflow: hidden;
    padding-bottom:20px;
}
.blog-cover .lucky{
    display: block;
    font-size: 10px;
    margin: 10px auto 0;
    width: 300px;
    color: #d7272b;
}

.blog-cover .lucky:hover{
    font-weight: bold;
}
.blog-cover .lucky:before {
    display: inline-block;
    margin-right: 5px;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f129";
}
.blog-cover img{
   display: block;
   margin: auto;
   margin-bottom: 20px;
}

.blog-content {
    padding: 10px 15px 40px 15px;
    border-top: none;
    background: linear-gradient(0deg,#212121 0,#383838 100%);
}   
.single-blog {
    position: relative;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
    height: 100%;
    background: linear-gradient(0deg,#212121 0,#383838 100%);
    border-radius: 12px;
    overflow: hidden;
}

.blog-title {
    margin-bottom: 0px;
}
.blog-meta {
    position: relative;
}
.blog-meta span {
    font-size: 13px;

    margin-right: 10px;
    color: #ffffff ;
}
.admin-type i, .date-type i, .comments-type i {
    color: #ffffff;
    margin-right: 5px;
}
.expiry-type i {
    color: #ed1c24;
    margin-right: 5px;
}

.single-blog:hover .image-scale {
  transform: scale(1.1);
  transition: 0.5s;
}
.single-blog:hover .image-scale::after{
    background: rgba(0,46,91,0);
}
.blog-grid-fast {
    margin-top: -30px;
}
.single-blog.b-mar{
    margin-top: 20px;
}
.blog-content a h4:hover{
    color:#ffffff;
}
/*----------------------------------------
 11.Reviews Area Css
----------------------------------------*/
.reviews-area{
    position: relative;
}
.reviews-area{
    position: relative;
}
.single-testi {
    margin: 0px 0px 40px;
}
.clients-text {
    padding: 30px 30px;
    position: relative;
    background-color: #fff;
    border:1px solid #f5f5f5;
    border-radius: 4px;
}
.testi-img {
    position: relative;
    margin-bottom: 20px;
    display: block;
    overflow: hidden;
}
.testi-img img {
    max-width: 80px;
    height: auto;
    border-radius: 50px;
    border: 1px solid #ccc;
    float: left;
    margin-right: 20px;
}
.reviews-content {
    margin-bottom: 15px;
}
.testimonial-carousel .active.center .single-testi .clients-text{
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
}
.testi-text h4 {
    font-weight: 700;
    text-transform: capitalize;
    font-size: 22px;
    margin-bottom: 10px;
    line-height: 26px;
}
.guest-rev {
    font-weight: 400;
}
.testi-text p {
    margin-bottom: 0px;
}
.client-rating {
    margin-bottom: 15px;
}
.testi-text span a{
    color:linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
}
.testi-text h5 {
    color: #6a7d91;
    font-size: 20px;
}
.client-rating a {
    display: inline-block;
    color: #fec731;
    font-size: 20px;
    padding: 0px 5px 0px 0px;
}
.testimonial-carousel.owl-carousel.owl-theme .owl-controls .owl-dots div.owl-dot > span {
    background: #3d5368 none repeat scroll 0 0;
    display: inline-block;
    height: 8px;
    width: 8px;
    -moz-transition:0.4s;
    -webkit-transition:0.4s;
    -o-transition:0.4s;
    -ms-transition:0.4s;
    transition:0.4s;
    border-radius: 50%;
}
.testimonial-carousel.owl-carousel.owl-theme .owl-controls .owl-dots {
    bottom: -20px;
    display: block;
    left: 50%;
    margin-left: -40px;
    position: absolute;
}
.testimonial-content {
    margin-bottom: 15px;
}
.testimonial-carousel.owl-carousel.owl-theme .owl-controls .owl-dots div.owl-dot {
    display: inline-block;
    margin: 0 3px;
}
.testimonial-carousel.owl-carousel.owl-theme .owl-controls .owl-dots div.owl-dot.active span {
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    width: 30px;
    border-radius: 20px;
}
/*----------------------------------------
  12.Subscribe Area Css
----------------------------------------*/
.subscribe-area{
    position: relative;
}
.subscribe-area form#contactForm {
    border-radius: 1px;
    box-shadow: none;
    background: transparent;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
}
.subs-form {
    padding: 0px 80px 70px;
}
.subs-form input#email {
    width: 75%;
    display: inline-block;
    border: none;
    border-radius: 6px 0px 0px 6px;
    padding: 10px 20px;
    height: 60px;
    margin-bottom: 0px !important;
    background: transparent;
    border: 1px solid #ccc;
}
.subs-form button#submit {
    width: 25%;
    display: inline-block;
    min-height: 60px;
    background: #fff;
    border: none;
    border-radius: 0px 1px 1px 0px;
    float: right;
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    color: #fff;
    text-transform: uppercase;
    font-weight: 600;
    transition: 0.4s;
}
.subscribe-area button#submit:hover {
    opacity: 0.7;
    transition: 0.4s;
}
.single-card {
    padding: 25px 0px ;
    text-align: center;
}
.single-card img {
    width: 100% !important;
    margin-bottom: 10px;
    border: 2px solid #765b3d;
}
.single-card h5 {
    font-size: 14px;
}
/*----------------------------------------*/
/*  13. Footer Area
/*----------------------------------------*/
.footer-1 {
    background:#2E2E2D;
}
.footer-area{
    padding: 90px 0px;
}
.footer-logo {
    margin-bottom: 20px;
}
.footer-head h4 {
    color: #ffffff;
    font-size: 16px;
    margin-bottom: 0px;
    text-transform: uppercase;
}
.footer-icons ul li {
    display: inline-block;

}
.footer-icons ul li a {
    color: #26ade3;
    display: block;
    font-size: 16px;
    line-height: 34px;
    text-align: center;
  
    width: 34px;
    height: 34px;
 
    transition: 0.4s;
    background:transparent;
    border: 1px solid #26ade3;

}
.footer-icons ul li a:hover{
    color:#fff;
    background:linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%); 
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    transition: 0.4s;
    transform: translateY(-2px);
}
.footer-icons {
    margin-top: 20px;
}
.footer-contacts p span {
    color: #26ade3;
    font-weight: 700;
}
.footer-content.logo-footer {
    margin-right: 40px;
}
.footer-list{
    margin-bottom: 20px;
}
.footer-list .lac {
    overflow: hidden;
}
.footer-list .lac img{
    padding-right:10px ;
    float: left;
}
.footer-list li{
    font-weight: 400;
     transition: 0.4s;
     font-size: 12px;
}
.footer-list li a {
    color: #cfcfcf;
    padding: 5px 0px 5px 20px;
    display: block;
    position: relative;
    font-weight: 400;
     transition: 0.4s;
     font-size: 12px;
}
.footer-list li a:first-child{
	padding-top: 0px;
}
.footer-list li a::after {
    position: absolute;
    content: "\e65d";
    right: auto;
    font-family: themify;
    top: 1px;
    left: 0;
    font-size: 14px;
}
.footer-list li.app a{
    padding: 0px;
}
.footer-list li.app a::after {
    position: absolute;
    content: "";
}
.footer-list li a:hover{
   transform: translatex(2px); 
     transition: 0.4s;
}
.footer-list li a:hover,
.footer-list li a:hover::after{
    color: #26ade3;
     transition: 0.4s;
}
.footer-area-bottom {
    padding: 25px 0;
    background:#000000;
}
.copyright-text a:hover{
	text-decoration: underline;
	color:linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
}
.copyright-text a {
    color: #26ade3;
}
.copyright > p {
    margin-bottom: 0;
    color: #dbeee1;
}
.copyright a {
    color: #df8731;
}
.copyright a:hover{
    color: #26ade3;
}
/*----------------------------------------*/
/*  14.	Home-2  CSS
/*----------------------------------------*/
.header-area-2 {
    background: #000000;
}
.intro-area-2 {
    position: relative;
	overflow: hidden;
    z-index: 1;
}
.intro-area-2 .slider-content {
    text-align: center;
}
.intro-area-2::after {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background: url(img/background/bg2.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    content: "";
    opacity: 0.80;
}
.intro-area-2 .layer-1 h2 {
    margin: 0px auto 20px;
    font-size: 52px;
    line-height: 62px;
    max-width: 820px;
}
.intro-area-2 .layer-2 p {
    margin: 0px auto 20px;
}
/*----------------------------------------*/
/*  15. Breadcumbs Area
/*----------------------------------------*/
.page-area {
    position: relative;
    z-index: 1;
}
.transparent-header{
    background: transparent;
}
.page-area {

    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}
.page-area::after{
    position: absolute;
    content: "";
    left:0;
    top: 0;
    width:100%;
    height: 100%;
    background: rgba(30 30 30 / 90%);
    z-index: -1;
}
.breadcrumb .section-headline {
    text-align: center;
    padding-bottom: 10px;
    margin-top: 50px;
}
.breadcrumb {
    background-color: transparent;
    margin-bottom: 0;
    padding: 120px 0px 60px;
}
.breadcrumb h1 {
    font-size: 40px;
    line-height: 50px;
    margin-bottom: 0px;
    text-transform: uppercase;
}
.breadcrumb ul li {
    display: inline-block;
    padding: 0px 10px 0px 20px;
    position: relative;
    font-size: 16px;
    font-weight: 600;
}
.breadcrumb ul li.home-bread{
    padding-left: 0px;
}
.breadcrumb ul li.home-bread::after {
    position: absolute;
    content: "\f105";
    font-family: fontAwesome;
    right: -10px;
    top: 0;
}

.breadcrumb ul li.page-bread::after {
    position: absolute;
    content: "\f105";
    font-family: fontAwesome;
    right: -10px;
    top: 0;
}

.breadcrumb ul li a{
    color: #cfcfcf;
}
.breadcrumb ul li a:hover{
    text-decoration: underline;
}
/*----------------------------------------*/
/*  16. Affiliate page area
/*----------------------------------------*/
.single-proses {
    margin-top: 10px;
    margin-bottom: 30px;
}
.proses-icon a {
    width: 100px;
    height: 100px;
    line-height: 97px;
    font-size: 36px;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
    display: inline-block;
    border-radius: 50%;
    margin-bottom: 30px;
}
.proses-icon {
    position: relative;
    display: inline-block;
}
.point-view {
    width: 40px;
    height: 40px;
    line-height: 37px;
    font-size: 16px;
    color: #fff;
    border-radius: 50%;
    position: absolute;
    left: -10px;
    top: -10px;
}
.proses-text p {
    margin-bottom: 0px;
}
.point-blue .point-view{
    background: #F39D36;
    border: 1px solid #F39D36;
}
.point-orange .point-view{
    background: #0098D7;
    border: 1px solid #0098D7;
}
.point-green .point-view{
    background: #1AA15F;
    border: 1px solid #1AA15F;
}
.point-blue.proses-icon a{
    color:#F39D36;
}
.point-orange.proses-icon a{
    color:#0098D7;
}
.point-green.proses-icon a{
    color:#1AA15F;
}
.proses-text h4 {
    text-transform: capitalize;
    font-size: 22px;
    max-width: 270px;
    margin: 0px auto;
}
.faq-area .contact-form input[type="text"], 
.faq-area .contact-form input[type="email"] {
    border: 1px solid #ccc;
    border-radius: 0;
    height: 44px;
    margin-bottom: 15px;
    padding-left: 20px;
    width: 100%;
}
.faq-content h3{
    font-size: 28px;
    font-weight: 600;
	color:#444;
	padding-bottom: 20px;
}
.faq-area .faq-content .contact-form textarea#message {
    height: 135px;
}
.faq-area .quote-btn {
    font-weight: 600;
    color: #fff;
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    display: inline-block;
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    padding: 10px 20px;
    width: 134px;
    text-transform: uppercase;
    border-radius: 20px;
    transition: 0.4s;
    margin-top: 10px;
}
.faq-area .quote-btn:hover{
	background: transparent;
    color:linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    transition: all 0.4s ease 0s;
    transform: translateY(-4px);
}
.overview-area {
    position: relative;
}
.overview-text {
    margin-top: 80px;
}
.overview-image {
    border-radius: 10px;
    position: relative;
    overflow: hidden;
}
.overview-text h3 {
    font-size: 40px;
    line-height: 46px;
}
.overview-text li {
    display: block;
    position: relative;
}
.overview-text ul li a {
    font-size: 15px;
    padding: 6px 0px 6px 35px;
    display: block;
    color:#cfcfcf;
}
.overview-text li::after {
    position: absolute;
    left: 0px;
    top: 6px;
    content: "\e64c";
    font-family: themify;
    width: 24px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    border-radius: 50px;
    font-size: 12px;
    color: #fff;
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
}
.overview-btn {
    padding: 10px 20px;
    border: 1px solid #;
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    color: #fff;
    transition: 0.4s;
    font-size: 16px;
    font-weight: 700;
    border-radius: 20px
    margin-top: 20px;
    display: inline-block;
    text-transform: capitalize;
}
.overview-btn:hover{
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    background:transparent;
    color: #26ade3;
    transition: 0.4s;
}
/*----------------------------------------*/
/*  17.Lottery Number area
/*----------------------------------------*/
.buy-ticket-btn {
    margin-top: 20px;
}
.single-lottery {
    background: #fff;
    border: 1px solid #f5f5f5;
    padding: 30px 30px 40px;
    border-radius: 4px;
    margin-bottom: 30px;
}
.lottery-top h4 {
    text-transform: uppercase;
    font-size: 20px;
}
.genreted-text {
    display: block;
    margin-bottom: 15px;
    font-size: 14px;
}
.single-lottery .number-top label {
    padding-left: 40px;
    font-weight: 400;
    font-size: 17px;
}
.single-lottery .number-top input{
    position: absolute;
    top: 20%;
}
.lottery-top{
    margin-bottom: 30px;
    text-align: center;
    position: relative;
}
.lottery-top .ticket-rate {
    position: absolute;
    left: -31px;
    top: -30px;
}
.auto-number {
    margin-bottom: 30px;
    border-bottom: 1px solid #666;
    padding-bottom: 30px;
}
.number-top {
    position: relative;
}
.single-lottery .number-top input{
    position: absolute;
    top: 20%;
}
.number-serial li{
    display: inline-block;
}
.number-serial li a {
    display: block;
    color: #333;
    border: 1px solid #333;
    border-radius: 50%;
    font-size: 13px;
    font-weight: 700;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    margin: 3px 1px;
}
.self-ticket {
    margin-top: 25px;
}
.self-ticket span {
    display: block;
    margin-bottom: 10px;
    line-height: 30px;
}
.self-ticket li{
    display:inline-block;
}
.number-serial li.active a,
.self-ticket li  {
    display: inline-block;
    color: #fff;
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    border-radius: 50%;
    font-size: 18px;
    font-weight: 700;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    margin: 3px 1px ;
}
/*----------------------------------------*/
/*  18. FAQ  Area
/*----------------------------------------*/
.faq-area{
    position: relative;
}
.company-faq {
    display: block;
    overflow: hidden;
}
.company-faq.left-faq {
    margin-right: 40px;
}
.company-faq.right-faq {
    margin-left: 40px;
}
.faq-details .panel-heading {
    padding: 0;
}
.panel {
    margin-bottom: 20px;
    background-color: transparent;
    border: none;
    border-radius: 4px;
}
.panel-default {
    border-color: #f5f5f5;
    border-radius: 0 !important;
}
.panel-group .panel+.panel {
    margin-top: 30px;
}
.panel-default > .panel-heading {
    background: transparent;
}
.panel-default>.panel-heading+.panel-collapse>.panel-body {
    border:none;
    background: transparent;
}
.faq-details h4.check-title a {
    display: block;
    font-weight: 500;
    padding: 10px 10px 10px 70px;
    text-decoration: none;
    background: transparent;
    color:#ffffff;
}
.panel-body {
    padding: 15px 15px 0px 70px;
}
.faq-details h4.check-title {
    color: #26ade3;
    font-size: 19px;
    margin-bottom: 0px;
    text-transform: capitalize;
}
.faq-details .panel-heading h4 a{
    position: relative;
}
.faq-details .panel-heading h4 a.active::before,
.faq-details .panel-heading h4 a::before {
    color: #fff;
    content: "\e65c";
    font-family: themify;
    font-size: 20px;
    left: 0px;
    line-height: 50px;
    position: absolute;
    text-align: center;
    top: 0px;
    width: 50px;
    height: 100%;
    border-radius: 20px;
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
}
.faq-details .panel-heading h4 a.active::before {
    content: "\e65f";
}
.faq-details .panel-heading h4 a.active {
    color: #26ade3;
}
.faq-area .col-md-6{
	padding-left: 0px;
	padding-right: 0px;
}
.faq-area .faq-content {
    margin-left: 80px;
    padding: 30px;
    border-radius: 20px
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
    background: #fff;
}
.faq-content h4{
	padding-bottom: 20px;
}
/*----------------------------------------*/
/*  19. Blog Sidebar Area
/*----------------------------------------*/
.blog-left-content {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
}


.blog-left-content .col-md-4{
    margin-bottom: 30px;
}


.blog-page-area .single-blog {
    padding: 5px;
    background: #fff;
}
.blog-page-area .blog-content{
	padding: 10px 15px 20px;
}
.blog-search-option input {
    padding: 5px 15px;
    width: 80%;
    border: none;
    height: 56px;
    background: transparent;
}
.blog-search-option {
    margin-bottom: 30px;
    display: block;
    background: #fff;
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    border-radius: 20px;
}
.blog-search-option button {
    background: transparent;
    border: none;
}
.blog-search-option button i {
    line-height: 16px;
    font-size: 18px;
    padding: 0px 10px;
}
.blog-search-option button i:hover {
    color: #26ade3;
}
.left-blog h4 {
    position: relative;
    color: #3d5368;
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 0px;
    padding: 5px 0px;
    text-transform: capitalize;
}
.left-blog h4::after {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 70px;
    height: 1px;
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
}
.blog-left-content .blog-content::after{
    display: none;
}
.left-side {
    padding-right: 40px;
}
.right-side {
    padding: 30px;
    background: #f5f5f5;
    border-radius: 10px;
}
.left-blog {
    overflow: hidden;
    padding-bottom: 10px;
}
.blog-category li,
.left-blog li {
    display: block;
    position: relative;
}
.left-blog ul li a {
    color: #3d5368;
    display: inline-block;
    font-size: 14px;
    padding: 7px 0px 7px 25px;
    text-transform: capitalize;
}
.blog-category ul {
    margin-top: 12px;
}
.left-blog ul li span {
    display: inline-block;
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    width: 24px;
    height: 24px;
    text-align: center;
    border-radius: 4px;
    font-size: 13px;
    color: #26ade3;
    line-height: 24px;
}
.pst-content .date-type{
	font-size: 12px;
    font-weight: bold;

}
.blog-category ul li:after {
    position: absolute;
    content: "\e649";
    right: 5px;
    top: 8px;
    font-family: themify;
    color: #3d5368;
    font-size: 11px;
}
.popular-tag.left-blog ul li a:before {
    display: none;
}
.recent-single-post {
    display: block;
    overflow: hidden;
    padding: 15px 0px;
}
.recent-single-post:last-child {
    border-bottom: none;
}
.post-img {
    display: inline-block;
    float: left;
    padding-right:10px;
}
.left-blog .post-img a {
    display: block;
    border:1px solid #fafafa; 
}
.left-blog .post-img a img {
    border-radius: 4px;
}
.pst-content {
    padding-left: 70px;
}
.pst-content p{
	margin-bottom: 0px;
}
.pst-content p a:hover,.left-blog ul li a:hover {
    color: #26ade3;
}
.blog-page-area .blog-content {
    background: #f9f9f9;
}
.pst-content p a {
    color: #3d5368;
    font-size: 12px;
}
.blog-tags {
    padding: 1px 0;
}
.recent-single-post img {
	width: 100%;
    max-width: 60px;
	height: 60px;
    object-fit: cover;
    border-radius: 20px
}
.left-blog li:last-child {
    border-bottom: 0 ;
}
.popular-tag.left-side-tags.left-blog ul {
    padding:0px;
}
.left-tags .left-side-tags ul li {
    border-bottom: 0;
    display: inline-block;
    margin: 5px 3px;
}
.left-tags .left-side-tags ul li a {
    padding: 4px 6px;
    width: auto;
    background: #fff;
    color: #3d5368;
    border-radius: 3px;
    font-weight: 400;
    font-size: 12px;
}
.left-tags .left-side-tags ul li a:hover {
	color:#fff;
	background:linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
}
.left-side-tags h4 {
    margin-bottom: 15px;
}
.blog-side-area .blog-right-column{
	margin-top: -30px;
}
.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 10px 0 0px;
    border-radius: 4px;
}
.pagination>li>a, 
.pagination>li>span {
    position: relative;
    float: left;
    padding: 6px 12px;
    line-height: 1.42857143;
    text-decoration: none;
    color: #3d5368;
    background-color: #f4f5f5;
    border: none;
    margin-left: -1px;
    border-radius: 3px
}
.pagination>li {
    display: inline-block;
    margin: 0px 3px 0px 0px;
}
.pagination>.active>a, 
.pagination>.active>span, 
.pagination>.active>a:hover, 
.pagination>.active>span:hover, 
.pagination>.active>a:focus, 
.pagination>.active>span:focus{
    z-index: 3;
    color: #fff;
    background-color: #26ade3;
    cursor: default;
    border-radius: 20px
}
.pagination>li>a:hover, .pagination>li>span:hover, .pagination>li>a:focus, .pagination>li>span:focus {
    z-index: 2;
    color: #fff;
    background-color: #26ade3;
    border-color: #26ade3;
    border-radius: 20px
}
.adver-img {
    margin-top: 20px;
}
/*----------------------------------------*/
/*  20. Blog Details
.blog-post-wrapper{
    margin-right: 30px; 
}
/*----------------------------------------*/

.comments-heading h3, h3.comment-reply-title {
    border-bottom: 1px solid #ddd;
    color: #3d5368;
    font-size: 18px;
    margin: 0 0 40px;
    padding: 0 0 5px;
    text-transform: capitalize;
}
.comments-list ul li{
    margin-bottom: 25px;
}
.comments-list-img{
    float: left;
    margin-right: 15px;
	border-radius: 50%;
	
}
.comments-list-img img {
    border-radius: 20px;
    border: 1px solid #ddd;
}
.comments-content-wrap {
    color: #3d5368;
    font-size: 14px;
    margin: 0 0 15px 90px;
    padding: 10px;
    position: relative;
}
blockquote {
    padding: 20px 40px 40px 80px;
    margin: 0 0 20px;
    font-size: 15px;
    border-left: none;
    font-style: italic;
    position: relative;
    background: #f5f5f5;
}
blockquote::before {
    position: absolute;
    top: 20px;
    left: 30px;
    content: "\f10d ";
    font-family: fontawesome;
    font-size: 34px;
    color: #3d5368;
}
blockquote p {
    font-size: 16px !important;
    line-height: 28px;
}
.author-avatar {
    display: inline-block;
    float: left;
    width: 10%;
}
.comments-content-wrap span b{margin-right:5px}
.comments-content-wrap span a:hover{}
span.post-time{margin-right:5px}
.comments-content-wrap p {
    color: #3d5368;
    margin-top: 10px;
}
.threaded-comments{
	margin-left:50px
}
.comment-respond {
    margin-top: 20px;
}
span.email-notes{
	color: #3d5368;
    display: block;
    font-size: 12px;
    margin-bottom: 10px;
}
.comment-respond p {
    color: #3d5368;
    margin-bottom: 5px;
}
.comment-respond input[type=text],
.comment-respond input[type=email]{
    border: 1px solid #ccc;
    border-radius: 0;
    height: 46px;
    margin-bottom: 15px;
    padding: 0 0 0 10px;
    width: 100%;
	background: transparent;
}
.comment-respond textarea#message-box{
    border: 1px solid #ccc;
    border-radius: 0;
    max-width: 100%;
    padding: 10px;
	height: 200px;
    width: 100%;
	background: transparent;
}
.comments-content-wrap span a {
    color: #26ade3;
}
.comments-content-wrap span a:hover {
    color: #26ade3;
}
.comment-respond .add-btn.contact-btn {
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    color: #fff;
    display: block;
    font-size: 16px;
    margin-top: 5px;
    padding: 10px 20px;
    transition: 0.4s;
    border-radius: 20px
    width: auto !important;
    margin-top: 20px;
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    text-transform: capitalize;
    font-weight: 600;
}
.comment-respond .add-btn.contact-btn:hover{
    background: #fff;
	color: #26ade3;
    border:1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
}
.blog-page-details .left-blog-page {
    margin-top:0px;
    margin-bottom:30px;
}
.single-post-comments,
.related-post{
    margin-top: 30px;
}
.left-head-blog .pst-content p{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    line-height: 18px;
}
.blog-content h3{
    font-size: 16px;
    line-height: 18px;
    color: #ffffff;
}
.blog-details .blog-content h4 {
    font-size: 22px;
    line-height: 34px;
}
.blog-details .blog-content h5 {
    font-size: 20px;
}
.blog-details .blog-content {
    
}
.blog-details .blog-images img {
    width: 100%;
    height: 100%;
        /*max-height: 450px;*/

    object-fit: cover;
}
.blog-details .img-blog {
    margin: 30px 0px;
    width: 100%;
    height: 100%;
    max-height: 350px;
    overflow: hidden;
}
.related-post-list .recent-single-post {
    width: 50%;
    float: left;
    padding: 0px 20px 0px 0px;
}
.related-post-list .recent-single-post:last-child{
    padding: 0px 0px 0px 20px;
}
.blog-details .blog-meta {
    margin-bottom: 10px;
}
/*----------------------------------------*/
/*  21.	Contact Us page
/*----------------------------------------*/
.contact-area {
    position: relative;
}
.contact-page .contact-form {
    margin-top: 30px;
}
.contact-form input[type="text"], .contact-form input[type="email"] {
    border: 1px solid #ccc;
    border-radius: 0;
    height: 54px;
    margin-bottom: 15px;
    padding-left: 20px;
    width: 100%;
}
.contact-form textarea#message {
    border: 1px solid #ccc;
    border-radius: 0px;
    height: 220px;
    padding: 20px;
    width: 100%;
}
.contact-page .contact-btn {
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    color: #fff;
    display: inline-block;
    font-size: 20px;
    margin-top: 15px;
    padding: 12px 40px;
    transition: 0.4s;
    border-radius: 20px;
    width: auto;
    float: left;
    font-weight: 700;
}
.contact-page .contact-btn:hover {
    background: #fff;
    color: #26ade3;
    transition: 0.4s;
}
.contact-inner {
    overflow: hidden;
    padding: 60px 0px 30px;
}
.contact-single {
    padding: 50px;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
}
.club-btn {
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 20px;
    font-weight: 700;
    margin-top: 20px;
    padding: 10px 30px;
    text-align: center;
    text-transform: capitalize;
    transition: all 0.4s ease 0s;
    border-radius: 20px;
}
.club-btn:hover {
    color: #26ade3;
    background: transparent;
    transition: all 0.4s ease 0s;
}
/*----------------------------------------*/
/*  22. Terms & Conditions
/*----------------------------------------*/
.terms-area{
    position: relative;
}
.company-terms {
    display: block;
    overflow: hidden;
    margin-right: 60px;
}
.left-terms {
    display: block;
    overflow: hidden;
    padding-right: 40px;
}
.right-terms {
    display: block;
    overflow: hidden;
    padding-left: 40px;
}
.single-terms .number {
    color: #26ade3;
    font-weight: 600;
    padding-right: 10px;
    float: left;
}
.single-terms h4 {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 10px;
}
.single-terms p {
    padding-left: 40px;
}
span.terms-text {
    padding-left: 40px;
    display: inherit;
    font-size: 20px;
    font-weight: 600;
}
.single-terms {
    margin-bottom: 30px;
}
.terms-right {
    background: #f5f5f5;
    padding: 40px 30px 30px;
    overflow: hidden;
}
.terms-list li {
    position: relative;
    padding-left: 30px;
    margin: 5px 0px;
    line-height: 32px;
}
.terms-list li::after {
    position: absolute;
    left: 0px;
    top: 6px;
    content: "\e64c";
    font-family: themify;
    width: 22px;
    height: 22px;
    line-height: 22px;
    text-align: center;
    border-radius: 50px;
    font-size: 12px;
    color: #26ade3;
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
}
/*--------------------------------*/ 
/* 23. Error page area
/*--------------------------------*/
.error-easy-text {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 30px;
}
.high-text{
    font-size: 200px;
    line-height: 200px;
}
.error-bot{
    font-size: 24px;
    color:#cfcfcf;
    font-size: 20px;
    font-weight: 500;
}
.error-btn {
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    color: #fff;
    font-size: 15px;
    padding: 12px 20px;
    transition: 0.4s;
    margin-top: 15px;
    text-transform: uppercase;
    margin-top: 30px;
    display: inline-block;
	font-weight: 700;
	border-radius: 20px
}
.error-btn:hover{
    background: transparent;
    color: #26ade3;
     transition: all 0.3s ease 0s;
}
/*----------------------------------------
 24. Login And Register page
----------------------------------------*/
.login-area{
    background:url(img/background/bg2.jpg) no-repeat scroll center center / cover;
    position: relative;
}
.login-overlay {
    position: absolute;
    background: rgba(242,241,242,0.90);
    top: 0;
    width: 100%;
    left: 0;
    height: 100%;
}
.login-form {
    background: #fff;
    padding: 40px;
    margin: 0px 40px;
    border-radius: 4px;
}
.login-area form#contactForm {
    border: none;
    border-radius:0;
    box-shadow: none;
    background: #fff;
}
.login-form .form-control {
    display: block;
    width: 100%;
    height: 50px;
    padding: 7px 15px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #ffffff;
    background-color: transparent;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 20px;
    margin-bottom: 20px;
}
.login-title {
    font-size: 24px;
    margin-bottom: 20px;
}
.slide-btn.login-btn {
    border: 1px solid linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    display: inline-block;
    font-weight: 600;
    margin: 0px;
    padding: 5px 10px;
    text-align: center;
    text-transform: uppercase;
    transition: all 0.4s ease 0s;
    width: 100%;
    border-radius: 0px;
    background: linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    color: #fff;
    height: 50px;
    font-size: 16px;
}
.slide-btn.login-btn:hover{
    background: transparent;
    color:linear-gradient(to right,#df8731 0,#f5ac4d 15%,#f5ac4d 30%,#df8731 55%,#df8731 100%);
    transition: all 0.4s ease 0s;
}
.flex-box{
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
}
.check-group {
    position: relative;
    margin: 10px 0px 20px;
}
.check-box{
    color: #ffffff;
    font-weight: 300;
    letter-spacing: 0;
    margin-bottom: 0;
    outline: none;
    display: -webkit-inline-box;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    padding-left: 0;
}
.check-box-input {
    position: absolute;
    left: 0px;
    top: 0px;
    min-height: 25px;
    height: 26px;
    margin: 0 !important;
    padding: 0 !important;
}
.remember-text {
    color: #ffffff;
    font-weight: 300;
    font-size: 14px;
    left: 25px;
    position: absolute;
    top: 0px;
}
.text-muted {
    font-size: 12px;
    float: right;
    margin-top: 2px;
    color: #ffffff;
}
.text-muted:hover{
    color: #ffffff;
}
.separetor {
    margin-top: 20px;
}
.separetor span {
    color: #ffffff;
    position: relative;
    top: 10px;
}
.sign-icon {
    display: block;
    overflow: hidden;
    margin-top: 40px;
    text-align: center;
}
.acc-not a {
    color: #26ade3;
}
.sign-icon ul li {
    display: inline-block;
    margin: 0px 2px;
}
.sign-icon ul li a {
    color: #ffffff;
    display: block;
    text-transform: capitalize;
    font-size: 16px;
    padding: 1px 12px;
    font-weight: 600;
}
.sign-icon ul li a:hover{
    color: #26ade3;
}
.sign-icon ul li a i {
    font-size: 16px;
    padding-right: 5px;
}
.acc-not {
    font-size: 13px;
    margin-top: 20px;
    font-weight: 600;
}
.signup-form .check-group {
    position: relative;
    margin: 0px 0px 20px;
}
/*----------------------------------------*/
/*  25.	Animation  CSS
/*----------------------------------------*/
.rotateme {
    animation-name: rotateme;
    animation-duration: 30s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
.last-item{
    margin-bottom: 0px;
}
.item-bounce {
    -webkit-animation: bounce 3s infinite ease-in-out;
    animation: bounce 3s infinite ease-in-out;
}
@-webkit-keyframes bounce {
  0% {
    -webkit-transform: translateY(-5px);
            transform: translateY(-5px);
  }
  50% {
    -webkit-transform: translateY(10px);
            transform: translateY(10px);
  }
  100% {
    -webkit-transform: translateY(-5px);
            transform: translateY(-5px);
  }
}

@keyframes bounce {
  0% {
    -webkit-transform: translateY(-5px);
            transform: translateY(-5px);
  }
  50% {
    -webkit-transform: translateY(10px);
            transform: translateY(10px);
  }
  100% {
    -webkit-transform: translateY(-5px);
            transform: translateY(-5px);
  }
}

@-webkit-keyframes popcircle {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  99% {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
  }
  100% {
    opacity: 0;
  }
}



/*--------------------------------*/
/* .End CSS
/*--------------------------------*/