/* @font-face {
    font-family: "Poppins";
    src: url(./fonts/OFL.txt);
} */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap');
body {
  font-family: 'Outfit', sans-serif;
}


.navbar {
    background-color: white;
    padding: 10px 20px;
    
}
.navbar .container{
    padding: 0 20px 0 20px;
}
.navbar-brand img {
    height: 40px;
}
.nav-link {
    color: black;
    font-weight: 500;
    font-size: 16px;
    margin: 0 10px;
   
}
.nav-link:hover {
    color: #0EB8EF;
}
.btn-custom {
    border-radius: 10px;
    padding: 6px 28px 6px 28px;
    font-weight: 500;
	    border-radius: 4px;
}
.btn-contact {
    background-color: #0EB8EF;
    color: white;
    border: none;
}
.btn-login {
    background-color: #0EB8EF;
    color: white;
    border: 1px solid #0EB8EF;
	padding: 6px 18px;
	
}
.btn-contact:hover, .btn-login:hover {
    opacity: 0.8;
	border:1px solid #0EB8EF
	color: #0EB8EF;
}
/*landing section*/
.landing .land{
    background-image: url('../images/landing.jpeg');
    height: 590px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
.landing .land::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5); 
}
.hero-section {
  
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white;
}



/* Content */
.hero-content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 39px;
   
}
.hero-content h2{
    font-size: 48px;
    font-weight: 700;
    line-height: 72px;
}

/* Countdown Timer */
.count {
    display: flex;
    align-items: center;
    gap: 12px;
}
.countdown {
    display: flex;
    justify-content: center;
    gap: 13px;
    height: 66px;
    border-radius: 4px;
    background-color: #CFCFCF;
    align-items: center;
}
.countdown>span{
    color: black;
    font-size: 32px;
}
.timer-box {
 
    color: black;
    line-height: 1;
    
  
    min-width: 60px;
   font-size: 16px;
}
.timer-box span{
    font-size: 27px;
    line-height: 1;
}
.timer-box .t_b{
    font-size: 13px;
}

/* Button */
.btn-competition {
    background-color: #0EB8EF;
    color: white;
    padding: 10px 20px;
    font-weight:500;
    border: none;
    border-radius: 5px;
    height: 66px;
    line-height: 30px;
    font-size: 20px;
}

.btn-competition:hover {
    background-color: #0EB8EF;
}

/* Highlighted Text */
.highlight {
    color: #AFCE35; /* Green color for emphasis */
    font-weight: bold;
}
.stats-section {
    background: linear-gradient(to right, #2CABE2, #54862E); 
    color: white;
    padding: 20px 0;
    text-align: center;
}
.stat-item {
    font-size: 20px;
    font-weight: bold;
}
.stat-desc {
    font-size: 16px;
    font-weight: 500;
}


 /* Section Styling */
 .how-it-works {
    text-align: center;
    padding: 50px 0;
}

.how-it-works h2 {
    font-weight: bold;
}
.how-it-works p{
    line-height: 33px;
    font-size: 22px;
    font-weight: 300;
}

.how-it-works span {
    color: #F1641C; /* Orange highlight */
}

/* Card Styling */
.step-card {
    background: white;
    border-radius: 30px 0;
    padding: 0px;
    text-align: center;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease-in-out;
    overflow: hidden;
   
    border: 2px solid transparent;
}

.step-card:hover {
    transform: translateY(-5px);
}

/* Header Colors */
.step-header {
    padding: 16px 0 16px 0;
    border-radius: 30px 0;
    display: flex;
    align-items: center;
    justify-content: center;

}

.green-header { background-color: #54862E; border-radius: 30px 0;}
.blue-header { background-color: #2CABE2;  border-radius: 30px 0;}
.orange-header { background-color: #F1641C; border-radius: 30px 0;}



/* Text Styling */
.step-title {
    font-weight: 700;
    margin-top: 30px;
    font-size: 22px;
    line-height: 36px;
}

.step-title  .highlight {
    font-weight: 700;
    margin-top: 30px;
    font-size: 22px;
    line-height: 36px;
}
.step-card p{
    padding: 0px 34px 10px 34px;
}
        /* Countdown Box Styling */
        .countdown-box {
            border: 1px solid #0EB8EF;
            background: linear-gradient(to right, #2CABE2, #54862E);
            border-radius: 15px;
            padding: 15px 20px;
            display: flex;
            align-items: center;
            justify-content: space-between;
          
            margin: auto;
        }

        .countdown-text {
            font-size: 32px;
            font-weight: 500;
            line-height: 45px;
        }

        .highlight {
            color:#F1641C; /* Orange */
            font-size: 32px;
            font-weight: 500;
            line-height: 45px;
        }

        .countdown-timer {
            display: flex;
            align-items: center;
            gap: 15px;
        }

        .timer-item {
            text-align: center;
        }

        .timer-label {
            color: #F1641C;
            font-weight: 500;
            font-size: 26px;
            line-height: 48px;
            text-shadow: 2px 1px black;
        }
        .timer-value{
            font-size: 30px;
            line-height: 45px;
            font-weight: 500;
            color: #fff;
            text-shadow: 2px 1px black;

        }
        .timer-item{
            border-left: 2px solid #00000080;
            padding: 0 23px;
        }

        .winners-section {
            text-align: center;
            margin: 40px 0;
        }

        .winners-section h2 {
            font-weight: 700;
            color: #F1641C;
            font-size: 32px;
            line-height: 48px;

        }

        .winner-card {
            border-radius: 10px;
            overflow: hidden;
            background: #fff;
            
           
            
            transition: transform 0.3s ease-in-out;
        }

        .winner-card:hover {
            transform: translateY(-5px);
        }

        .winner-card img {
            width: 100%;
            height: auto;
            border-radius:0;
        }

        .price-tag {
            position: absolute;
            bottom: 10px;
            left: 0px;
            background-color: #0EB8EF;
            color: #fff;
            font-weight: bold;
            padding: 5px 15px;
            border-radius: 0px 20px 20px 0px;
        }

        .winner-info {
            margin-top: 10px;
        }

        .winner-info h5 {
            font-size: 20px;
            font-weight: 300;
            line-height: 33px;
        }

        .winner-info p {
            margin: 5px 0;
            font-size: 29px;
            font-weight: 500;
        }

        .location {
            color: #666;
            font-size: 14px;
        }

        .date {
            color: #666;
            font-size: 14px;
        }
        .swiper {
            width: 100%;
            height: 100%;
          }
      
          .swiper-slide {
          
            font-size: 18px;
            background: #fff;
            display: flex;
           
           
          }
      
          .swiper-slide img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
          }
                  /* Footer Styles */
        .footer {
            background-color: #000000e0; 
            color: white;
            padding: 30px 0;
        }

        .footer-logo {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            text-align: center;
        }

        .footer-logo img {
      
            margin-bottom: 10px;
        }

        .social-icons {
            margin-top: 10px;
            display: flex;
            gap: 10px;
        }


        .social-logos img{
            width: 60%;
        }
        .social-icons a:hover {
            color: #ffcc00;
        }

        .footer-links {
            text-align: left;
        }

        .footer-links h5 {
            font-weight: 700;
            margin-bottom: 10px;
            font-size: 22px;
            line-height: 36px;
			    color: white;
        }

        .footer-links a {
            display: block;
            color: white;
            text-decoration: none;
            margin-bottom: 5px;
            transition: 0.3s ease;
            line-height: 30px;
    font-weight: 500;
    font-size: 16px;

        }

        .footer-links a:hover {
            color: #0EB8EF;
			transform: translateY(-2px);
        }

        .footer-bottom {
            border-top: 2px solid #ffffff8a;
            padding-top: 10px;
          color: white;
          
            font-weight: 500;
            font-size: 20px;
            line-height: 36px;
            letter-spacing: 0%;
         
            
        }
        .social-logos{
            background: white;
         
            border-radius: 50px;
            display: flex
        ;
            /* align-items: center; */
            justify-content: center;
        }
        .social-container {
            display: flex;
            gap: 7px;
            justify-content: center;
            align-items: center;
        padding:  15px 0;
        flex-wrap: wrap;
          
        }
        .footer-logo p{
            display: block;
            color: white;
            text-decoration: none;
            margin-bottom: 5px;
            transition: 0.3s ease;
            font-weight: 300;
            font-size: 18px;
            line-height: 30px; 
        }

        /* Social Icon Styling */
        .social-icon {
            width: 30px;
            height: 30px;
            border-radius: 50%;
            background: white;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 24px;
            transition: 0.3s ease;
            text-decoration: none;
        }

        /* Icon Colors */
        .facebook { color: #1877F2; }
        .twitter { color: black; } /* X (formerly Twitter) */
        .whatsapp { color: #25D366; }

        /* Hover Effects */
        .social-icon:hover {
            transform: scale(1.1);
          
        }

        /* Get Ticket Button Styling */
        .btn-get-ticket {
            background: linear-gradient(135deg, #54822c  0%, #228B22 100%);
            border: none;
            color: white !important;
            padding: 12px 30px;
            border-radius: 25px;
            font-weight: 600;
            text-decoration: none;
            display: inline-block;
            transition: all 0.3s ease;
			    width: fit-content;
    font-weight: 500 !important;
        }

        .btn-get-ticket:hover {
                transform: translateY(-2px) !important;
				color: white !important;
        }

        .get-ticket-section {
            text-align: center;
        }


@media (max-width: 586px){
    .hero-content h2 {
        font-size: 29px;
        font-weight: 700;
        line-height: 47px;
    }
    .count{
        flex-direction: column;
    }
    .hero-content{
        gap: 10px;
    }

    /* Mobile responsive for Get Ticket button */
    .btn-get-ticket {
        font-size: 14px;
        padding: 10px 20px;
        min-width: 140px;
    }
}
@media (min-width: 587px) and (max-width: 900px) {
    
}

/*login*/
.land2{
    background-image: url('../images/land2.jpeg');
    height: 372px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
}


.land2::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5); 
}
.form {
    display: flex;
    background: white;
    padding: 30px;
    border-radius: 10px;
 
  
    width: 100%;
}

.form-container {
    flex: 1;
    padding-right: 20px;
    display: flex;
        flex-direction: column;
        gap: 13px;
        align-items: flex-start;
}

.title {
    font-size: 22px;
    font-weight: bold;
}

.highlight {
    color: #F46A1B;
}

.input-group {
    margin-bottom: 15px;
}





.confirm-btn {
   
    padding: 11px 50px;
    background-color: #F1641C;
    color: white;
    font-size: 16px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-weight: bold;
    transition: 0.3s;
}

.confirm-btn:hover {
    background-color: #d85615;
}

.image-container {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.image-container img {
    max-width: 60%;
    height: auto;
}

.form-container .title{
    font-size: 30px;
    font-weight: 700;

}
.high_conf{
    color: #F1641C;
}
.input-field {
    width: 100%;
    padding: 10px 12px 10px 27px;
    
    border: 2px solid #1F73B7;
    border-radius: 7px !important;
    font-size: 20px;
    line-height: 36px;
    background-color: transparent;
    outline: none;
    transition: 0.3s;
    color: #D1D2D3;
}

.input-label {
    position: absolute;
    top: 50%;
    left: 28px;
    transform: translateY(-50%);
    background: transparent;
    padding: 0 5px;
    font-size: 16px;
    color: #1F73B7;
    transition: 0.3s;
    pointer-events: none;
    font-weight: bold;
}

/* Floating Label Effect */
.input-field:focus + .input-label,
.input-field:not(:placeholder-shown) + .input-label {
    top: 0px;
    font-size: 12px;
    color: #1F73B7;
    background: white;
}





@media (max-width: 586px){
    .form {
        flex-direction: column;
        gap: 30px;
    }
    .winner-card img{
        width: 621px;
    }
 
}

@media(max-width: 586px) and (max-width: 990px){

    .winner-card  img{
        width: 621px;
    }
}





.get-started-today {
                background:     linear-gradient(rgba(76 175 81 / 78%), rgb(43 138 35 / 48%)), 
    url("https://raffle.webexert.us/uploads/website/67b6ba06b11dc_1740028422.jpeg") 
    no-repeat center center / cover;;
    padding-top: 60px;
    padding-bottom: 80px;
}

.get-started-today .section-title {
    font-size: 2.5rem;
    font-weight: 700;
    color: white;
    margin-bottom: 2.5rem;
}


.get-started-today .quick-link-card {
    background: white;
    padding: 40px;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    text-align: center;
    height: 100%;
	position:relative;
}


.get-started-today .quick-link-card h3 {
    font-size: 1.8rem;
    font-weight: 700;
    margin-bottom: 15px;
    color: #333;
}

.get-started-today .quick-link-card p {
    color: #666;
    margin-bottom: 25px;
}

.get-started-today .btn-outline-primary {
    border: 2px solid #0EB8EF;
    color: #0EB8EF;
    background: transparent;
}

.get-started-today .btn-outline-primary:hover {
    background: #0EB8EF;
    color: white;
}

.get-started-today .btn-outline-secondary {
    border: 2px solid #228B22;
    color: #228B22;
    background: transparent;
}

.get-started-today .btn-outline-secondary:hover {
    background: #228B22;
    color: white;
}