.red{color: #ba2d0b;}.bg-red{background-color: #ba2d0b; color: #fff;}
.dark{color: #00161e;}.bg-dark{background-color:#00161e; color: #fff;}
.PageWrap{background-color: #fff;}
.contentWrap{max-width: 1000px;}
body, p, label, span, a, li, h1, h2, h3, h4 {font-family: 'Poppins', sans-serif;}

/* nav */
.nav .brand{width: 50%;}
.nav .logoImg{width: 75px;}
.nav .logoImg img{width: 100%;}
.nav .navItem div{display: inline-block;}
.nav .logoText{font-size: large;} .nav .logoText label{margin-bottom: 0px; color: #00161e;}
.nav a{text-decoration: none; font-size: small; color: #00161e;}
.nav { @include navbar;  justify-content: space-between; }
.navItem.brand { @include navbar-brand;}
.navItem.link { @include nav-item; margin-left: 1rem; }
.navItem.link a { @include nav-link;}
.navItem.link.btn { @include btn; margin-left: 0; }
.navbar-toggler { display: none; }
.nav-link { font-weight: bold; }
.nav .btn a{background-color: #ba2d0b; color: #fff;     border-radius: 4px; padding: 5px 10px;}


/* hero */
.hero{}
.hero .text .col{width: 50%;}
.hero .text p{font-size: x-large;}
.hero .text .red{font-size: xxx-large; font-weight: 900;}
.hero .text-p p{text-align: right; font-size: large; font-weight: 300;}
.hero .row {margin-top: 50px;}
.hero .banner{border-radius: 20px; overflow: hidden;}
.hero .heroImg img{width: 100%; border-radius: 20px; }
.hero .herobtn { width: 70%;  margin: 0 auto; background-color: #fff; border-radius: 20px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); padding: 20px; position: relative; margin-top: -90px;z-index: 1;text-align: center; margin-bottom: 5px;}
.hero .herobtn p { margin-bottom: 5px; font-size: medium; /* Adjust the font size as needed */ font-weight: 400;}
.hero .herobtn .label {font-size: 18px; font-weight: 200;}
.hero .herobtn a { text-decoration: none; display: inline-block; background-color: #ba2d0b; color: #fff; padding: 5px 10px;border-radius: 4px;}

/* feature */
.feature {margin: 100px 0px 100px 0px;}
.feature .container { text-align: center; padding: 50px 0px 0px 0px; }
.feature .container h3 { font-weight: 600; font-size: 20px; }
.feature .container p { font-weight: 200; font-size: 15px; }
.feature .grid { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 10px; }
.feature .col { background-color: #f0f0f0; display: flex; align-items: center; justify-content: center; font-size: 24px; overflow: hidden; padding: 0px; border-radius: 10px; position: relative; }
.feature .col img { width: -webkit-fill-available; height: -webkit-fill-available; }
.feature .col::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0, 1); opacity: 0.4; transition: opacity 0.3s ease; }
.feature .col:hover::before { background-color: rgba(186,45,11, 1); opacity: 0.8; }
.feature label { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; font-size: 15px; font-weight: 900; letter-spacing: 5px;}

/* download */
.download { margin: 0px 0px 100px 0px;  text-align: center; color: #00161e;}
.download h2 { font-size: 32px; margin-bottom: 10px; }
.download p { font-size: 18px; margin-bottom: 20px; font-weight: 200;}
.download .btn { min-width: 200px; padding: 10px 20px; margin: 10px; background-color: #ba2d0b; color: #fff; text-decoration: none; border-radius: 5px; display: inline-block; font-size: 18px; transition: background-color 0.3s ease; }
.download .btn:hover { background-color: #ff5733; }
.download .btn-disable{color: #ccc;cursor: not-allowed; pointer-events: none;background-color: #e0e0e0;}


/* statistics */
.statistics { text-align: center; margin: 0px 0px 100px 0px;}
.statistics .contentWrap { display: flex; justify-content: space-around; flex-wrap: wrap;}
.statistics .col {  width: 45%;  margin: 10px; padding: 20px; background-color: #fff;  border-radius: 10px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); }
.statistics h6 { font-size: 36px; margin: 0; color: #a6a6a6; font-weight: 600;}
.statistics label { font-size: 16px;  color: #a6a6a6;  margin-top: 10px;}


/* footer */
.footer { background-color: #333; color: #fff; padding: 50px 0; font-family: 'Poppins', sans-serif; }
.footerHead { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; }
.footerHead .col { width: 48%; margin-bottom: 20px; }
.footerHead h5 { font-size: 24px; margin-bottom: 10px; }
.footerHead h6 { font-size: 1rem; font-weight: 300; margin-bottom: 10px; }
.footerHead p { font-size: 16px; line-height: 1.5; font-weight: 200;}
.footerHead ul { list-style: none; padding: 0; }
.footerHead ul li { font-size: 13px; }
.footerHead ul li a { text-decoration: none; color: #fff; font-size: 16px; font-weight: 200;}
.footerbottom { text-align: center; padding: 20px 0; background-color: #222; }
.footerbottom p { font-size: 14px; margin: 0; }


/* privacy */
.privacy{margin: 50px 0px;padding: 10px;}
.privacy h1{font-size: xx-large; font-weight: 600;}
.privacy h2{font-size: large; font-weight: 200;margin-bottom: 50px;}
.privacy h3{font-size: x-large; font-weight: 300;}
.privacy p{ font-weight: 300;}
.privacy li{ font-weight: 300;}


@media (max-width: 768px) {
  .nav { flex-wrap: wrap; /* Wrap links for smaller screens */ }
  .navItem.link { margin-left: 0; /* Remove spacing again for small screens */ margin-bottom: 1rem; /* Add spacing below each link */ }
  .footerHead   {flex-direction: column;}
  .footerHead .col {width: 100%; margin-bottom: 0px;};
    
}

hr{border-top: 1px solid var(--primary-color); margin: 0 auto; max-width:600px}