@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

body {
  font-family:"Poppins", sans-serif !important;
}

html {
  scroll-behavior: smooth;
}

body {font-family:"Poppins", sans-serif !important;}
.header {
  position: relative;
  transition: all 0.3s ease;
}
#sticky-bottom-section {
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 9999;
  box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
  transition: transform 0.3s ease;
  height:100px;
}

#sticky-bottom-section.hide {
  transform: translateY(100%);
}
#sticky-bottom-section .buttons_main { top:20px;}
#sticky-bottom-section .icons .stand_icon { width:165px;}
#sticky-bottom-section .icons2 .start_icon { top:-22px;}

.header.sticky {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1030;
  background-color: #FFF3E9;
  -webkit-animation-name: animationFade;
    animation-name: animationFade;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.35);
    box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.35);
}
#about,
#project,
#client,
#gallery,
#contact {
  scroll-margin-top: 130px;
}

html, body{margin: 0px;padding: 0px;height: auto; color:#303030; font-family: 'clash_groteskregular'; font-size:14px; background:#fff;}
.header #navbarMenu { flex-direction:column; align-items:flex-end; position:relative;}
.header .navbar .navbar-brand { margin:10px 0px;}
.header .navbar .navbar-brand img { height:80px;}
.header .navbar-nav .nav-item { margin:0px 20px;}
.header .navbar-nav .nav-item .nav-link { color:#303030; font-size:16px; text-transform:uppercase;}
.header .navbar-nav .nav-item .nav-link.active { color:#303030; }

.loyality_referral_main { float:left; width:100%; margin:20px 0px; }
.loyality_referral_main .loyality_referral_left { width:60%; margin:20px 0px; float:left;}
.loyality_referral_main .loyality_referral_left h1{ color:#1961AA; font-size:16px; font-weight:700; line-height:22px; 
text-transform:uppercase; margin:0px; padding:0px; letter-spacing:3px;}
.loyality_referral_main .loyality_referral_left span{ color:#303030; font-size:26px; font-weight:400; }
.loyality_referral_main .loyality_referral_left p{ color:#303030; font-size:14px; font-weight:400; line-height:24px; margin:10px 0px; text-align:justify; }
.loyality_referral_main .loyality_referral_left p a { color:#1961AA; }

.loyality_referral_main .loyality_referral_right { width:40%; float:right; color:#303030;}
.loyality_referral_main .loyality_referral_right .refer_form { border:solid 1px #dee2e6; padding:16px;  color:#000;}
.loyality_referral_main .loyality_referral_right .refer_form h2.refer-title { font-size:20px; font-weight:400; color:#1961AA; margin-bottom:16px; line-height:26px;}
.loyality_referral_main .loyality_referral_right .refer_form input.form-control, .loyality_referral_main .loyality_referral_right .refer_form .input-group-text, .loyality_referral_main .loyality_referral_right .refer_form .form-select { border:0px; border-radius:0px; border-bottom:solid 1px #303030; background:none; padding-left:0px;}
.loyality_referral_main .loyality_referral_right .refer_form .refer-card .mb-3 { margin-bottom:22px !important;}
.loyality_referral_main .loyality_referral_right .refer_form .refer-card .mb-3 select.form-select { color:#444 !important;}
.loyality_referral_main .loyality_referral_right .refer_form .refer-card button.btn.enquire-btn { border:solid 1px #1961AA; color:#1961AA; border-radius:0px; font-size:14px; font-weight:600; line-height:24px;}
.loyality_referral_main .loyality_referral_right .refer_form .refer-card button.btn.enquire-btn:hover {border:solid 1px #1961AA; color:#1961AA; }
.loyality_referral_main .loyality_referral_right .refer_form .refer-card button.btn.enquire-btn:hover {border:solid 1px #1961AA; 
background:#1961AA; color:#fff; }

.benefits-wrapper { max-width: 700px; margin:30px 0px 0px 0px;}
.benefits-wrapper .benefit-item p { font-size:16px; font-weight:500; line-height:38px; text-align:left;}
.benefits-wrapper .benefit-item.last { padding-bottom: 20px; }
.benefit-item { display: flex;  align-items: flex-start;  gap: 20px;  position: relative;  padding-bottom: 36px;}
.benefit-item .timeline-line { position: absolute; left:28px; top: 60px; width: 2px; height: calc(100% - 40px); background-color: #1961AA;}
.benefit-item:last-child .timeline-line {  display: none;}
.icon-circle { width: 60px; height:60px; background-color: #1961AA; border-radius: 50%; display: flex; align-items: center;
  justify-content: center; color: #fff; font-size: 18px; flex-shrink: 0;}

.benefit-item p {  margin: 0;  font-size: 15px;  color: #333;  line-height: 1.6;  max-width: 550px;}
.benefits-wrapper .btn.btn-primary {  background-color: #1961AA; color: #fff; font-size:15px; font-weight:600; line-height:24px; padding:10px 20px; text-align:center; text-decoration:none; margin:45px 0px 20px 0px; float:left; border:0px; border-radius:0px;}
.modal-dialog { max-width:900px;}
.modal-header h5.modal-title { color:#1961AA; font-size:24px; }
.modal-body h3 { color:#000; font-size:20px; float:left; width:100%; margin:12px 0px;  }
.modal-content .modal-body span { color:#000; font-size:18px; float:left; width:100%; margin-top:10px; margin-bottom:10px; }
.modal-body ul li, .modal-body p { color:#303030; font-size:15px; line-height:28px; margin-top:2px; }

@media only screen and (max-width: 992px) {
.loyality_referral_main .loyality_referral_right, .loyality_referral_main .loyality_referral_left { float:left; width:100%;}
button.navbar-toggler { display:none; }
.header .navbar .navbar-brand img { width:80px; height:80px;}
.modal-dialog { max-width:800px;}
}	


@media only screen and (max-width: 768px) { 

.header .navbar-nav .nav-item { margin:0px;}

}