body{
  background-image: url("../../images/main/main-bg.png"); /* The image used */
  background-repeat: no-repeat;
  background-size: cover;
}

.myTable thead th{
  padding: 20px;
  background-color: #5D9470;
  color: #FFFFFF;
}



.roboto-thin {
  font-family: "Roboto", sans-serif;
  font-weight: 100;
  font-style: normal;
}

.roboto-light {
font-family: "Roboto", sans-serif;
font-weight: 300;
font-style: normal;
}

.roboto-regular {
font-family: "Roboto", sans-serif;
font-weight: 400;
font-style: normal;
}

.roboto-medium {
font-family: "Roboto", sans-serif;
font-weight: 500;
font-style: normal;
}

.roboto-bold {
font-family: "Roboto", sans-serif;
font-weight: 700;
font-style: normal;
}

.roboto-black {
font-family: "Roboto", sans-serif;
font-weight: 900;
font-style: normal;
}

.roboto-thin-italic {
font-family: "Roboto", sans-serif;
font-weight: 100;
font-style: italic;
}

.roboto-light-italic {
font-family: "Roboto", sans-serif;
font-weight: 300;
font-style: italic;
}

.roboto-regular-italic {
font-family: "Roboto", sans-serif;
font-weight: 400;
font-style: italic;
}

.roboto-medium-italic {
font-family: "Roboto", sans-serif;
font-weight: 500;
font-style: italic;
}

.roboto-bold-italic {
font-family: "Roboto", sans-serif;
font-weight: 700;
font-style: italic;
}

.roboto-black-italic {
font-family: "Roboto", sans-serif;
font-weight: 900;
font-style: italic;
}

h1,h2{
  color:#5D9470;
  
}



p{
  color:#2A312E;
}




i.fa {
  vertical-align: middle;
}





.list-group a{
  text-decoration: none;
  color: inherit;
}

.container {
  max-width: 960px;
}

.container-1280{
  max-width: 1280px;
  margin:0 auto;
  padding-left:15px;
  padding-right:15px;
}

.container-1140{
  max-width: 1140px;
  margin:0 auto;
  
}
  

  
  /*
   * Custom translucent site header
   */
  
  .site-header {
    
    background: transparent;
   
  }
  

  /*.sticky-top{
    background-color: #FAF9F7;
  }*/
  
  .site-header .company-logo img{
    height:140px;
  }

  .site-header.scrolled {
    background: #FBFAF8;
}
  
  .site-header .site-nav{
    
    float: right;
    padding-top: 60px;
    
  }
  
  .site-header .nav-link{
    
    font-family: 'Montserrat';
    color:#030303;
    margin-right: 30px;
    font-size:16px;
    font-weight: 500;
    
  }

  
  
  .site-header .nav-link:hover{
    
    font-family: 'Montserrat';
    color:#5D9470;
    
    transition: 0.3s;
    
  }

  .site-header .nav-link.active{
    
    font-family: 'Montserrat';
    color:#5D9470;
    
  }
  
  .site-header a {
    color: #8e8e8e;
    transition: color .15s ease-in-out;
  }
  
  
  .site-header a:hover {
    color: #fff;
    text-decoration: none;
  }
  
  .mobile-menu{
    display: none;
  }
  
  /*
  Product
  */

  

  .body-text{
    color:#616D6A;
  }


  .hero-container{
    
    
    margin-top:-440px;
   
    
  }

  .hero-caption{
    margin-top:220px;
    padding-left: 25px;
    
    
  }

  .welcome{
    background-color:rgb(223,234,214);
    height: 100px;
    width: 100%;
    font-family: 'Montserrat';
    padding-top:25px;

    
  }

  .scroll-section{
   
    border-top:5px solid rgb(69,90,100);
    background-color:rgb(223,234,214);
    height: 150px;
    width: 100%;
    font-family: 'Montserrat';
    padding-top:25px;
  }

  .btn-square, .btn-sm-square, .btn-lg-square {
      padding: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: normal;
      border-radius: 50px;
  }
  .btn-square {
      width: 38px;
      height: 38px;
  }

  .bg-green{
    background-color: rgb(113,163,1);
  }
  
   .section-title{
    font-size:20px;
    color: #5D9470;
   }

   .section-title-big{
    font-family: montserrat, sans-serif;
    position: relative;
    
    letter-spacing: 0.16em;
    font-size: 25px;
    font-weight: bold;
    line-height: normal;
   }

   .nav-link{
    color:rgb(93,152,48);
    height:53px;
   }

   .nav-link:hover{
    color:rgb(224,179,53);
   }

   .nav-pills .nav-link.active, .nav-pills .show>.nav-link{
    background-color:rgb(93,152,48);
   }
  
  .dashboard-count{
    border-radius: 10px;
   
    border: 1px solid #CCCCCC;
    background: #FFF;
   
    padding:30px;
  }

  .province-border{
    border-bottom:5px solid rgb(49,88,173);
  }

  .city-border{
    border-bottom:5px solid rgb(43,169,117);
  }

  .paid-border{
    border-bottom:5px solid rgb(224,179,53);
  }

  .unpaid-border{
    border-bottom:5px solid rgb(178,39,85);
  }

  .login-dialog{

    border: 1px solid rgb(93,152,48);
    background: #FFF;
    box-shadow: 0px 19px 29px -16px rgba(0, 0, 0, 0.25);
    padding:100px 30px 30px 30px;
    border-top-left-radius: 100px;
    border-bottom-right-radius: 100px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    width:500px;
    margin:0 auto;
    
  }

  .login-dialog h5{
    background: rgb(61,92,89);
    background: linear-gradient(90deg, rgba(61,92,89,1) 0%, rgba(93,152,48,1) 100%, rgba(128,204,41,1) 100%);
    color: #ffffff;
    line-height: 50px;
    position: absolute;
    top:20px;
    left: 0; 
    right: 0; 
    margin-left: auto; 
    margin-right: auto; 
    width: 530px;
    z-index: 2;
    margin: 0 auto;
    border-top-left-radius: 40px;
    border-bottom-right-radius: 40px;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
  }

  .button-lj-primary{
    
    background-color: #5D9470;
    color:#FFFFFF;

    border:4px solid #FFFFFF;
  }

  .button-lj-primary:hover{
    background-color:#FEEDAA;
    color:#5D9470;
  }

  .benefit{
    list-style: square;
  }

  .dashboard-dialog{
  
    border-radius: 5px;
   
    border: 1px solid rgb(93,152,48);
    background: #FFF;
    border-bottom: 5px solid rgb(224,179,53);
    padding:30px;
    
  
  }

  .welcome-container{
    display: table;
    height: 50%;
  }

  .welcome-container .welcome-text{
    display: table-cell;
    text-align: left;
    vertical-align: middle;
  }

  .bbn-quota{
    width: 100%;
    height: 100px;
    border-radius: 10px;
    border: 1px solid #CCCCCC;
    background: #FFF;
    padding: 30px;
    border-bottom:5px solid rgb(43,169,117);
    font-size:35px;

  }

  .tender-method{
    text-decoration: none;
    width:50%;
    background:#000000;
    display: inline-block;
  }

  .main-border-bottom{
    border-radius: 5px;
    border-bottom: 5px solid rgb(93,152,48);
  }
  
  
  .confirmation-dialog{
  
    border-radius: 50px;
   
    border: 1px solid #000;
    background: #FFF;
    box-shadow: 0px 19px 29px -16px rgba(0, 0, 0, 0.25);
    padding-top:30px;
    padding-left:100px;
    padding-right: 100px;
    padding-bottom:30px;
  
  }



  .app-table{
    width:100%;
    border-left: 1px solid rgb(93,152,48);
    border-right: 1px solid rgb(93,152,48);
    border-radius: 5px;
  }

  .app-table .header{
    background: rgb(93,152,48);
  }

  .app-table .header tr{
    border-bottom: 1px solid #ffffff;
  }

  .app-table .header td{
    color:#FFFFFF;
  }

  .app-table td{
    padding:20px;
  }

  .app-table .footer{
    background-color: transparent;
  }
  
  
  
  /*
  End of product style
  */
  
  .footer{
    font-family: 'Montserrat';
    font-size:14px;
    letter-spacing: 0.04em;
    background: transparent;
    color:#2A312E;
  }

  .connect{
    
    color: #2A312E;
    padding: 25px;
    
    border-radius:5px;
  }
  
  .footer .company-logo{
      padding-top:5px;
      padding-left:17px;
  }
  
  .footer .footer-nav{
    list-style: none;
  }
  
  .footer .footer-nav li{
    padding-bottom: 20px;
  }
  
  .footer .footer-nav li a{
    color:inherit;
    font-size:14px;
    text-decoration:none;
  }

  .footer .social-links a {
    font-size: 18px;
    display: inline-block;
    background: #47b2e4;
    color: #fff;
    line-height: 1;
    padding: 8px 0;
    margin-right: 4px;
    border-radius: 50%;
    text-align: center;
    width: 36px;
    height: 36px;
    transition: 0.3s;
}


.timeline-1 {
  border-left: 3px solid #5D9470;
  border-bottom-right-radius: 4px;
  border-top-right-radius: 4px;
  background: #FFFFFF;
  margin: 0 auto;
  position: relative;
  padding: 50px;
  list-style: none;
  text-align: left;
}

@media (max-width: 767px) {
  .timeline-1 {
    max-width: 98%;
    padding: 25px;
  }
}

.timeline-1 .event {
  border-bottom: 1px dashed #000;
  padding-bottom: 25px;
  margin-bottom: 25px;
  position: relative;
}

@media (max-width: 767px) {
  .timeline-1 .event {
    padding-top: 30px;
  }
}

.timeline-1 .event:last-of-type {
  padding-bottom: 0;
  margin-bottom: 0;
  border: none;
}

.timeline-1 .event:before,
.timeline-1 .event:after {
  position: absolute;
  display: block;
  top: 0;
}

.timeline-1 .event:before {
  left: -207px;
  content: attr(data-date);
  text-align: right;
  font-weight: 100;
  font-size: 0.9em;
  min-width: 120px;
  text-transform: uppercase;
  color: #5D9470;
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-style: normal;

}

@media (max-width: 767px) {
  .timeline-1 .event:before {
    left: 0px;
    text-align: left;
  }
}

.timeline-1 .event:after {
  -webkit-box-shadow: 0 0 0 3px #5D9470;
  box-shadow: 0 0 0 3px #5D9470;
  left: -55.8px;
  background: #fff;
  border-radius: 50%;
  height: 9px;
  width: 9px;
  content: "";
  top: 5px;
}

@media (max-width: 767px) {
  .timeline-1 .event:after {
    left: -31.8px;
  }
}
  
  /*
  Footer style
  */
  
  
  /*
   * Extra utilities
   */
  
  .flex-equal > * {
    flex: 1;
  }
  @media (min-width: 768px) {
    .flex-md-equal > * {
      flex: 1;
    }
  }
  
  
  @media (max-width: 767.98px) { 
  
    .welcome{
      background-color:rgb(223,234,214);
      height: 150px;
      width: 100%;
      font-family: 'Montserrat';
      padding-top:25px;
      padding-bottom:25px;
  
      
    }

    h1,h2{
      text-align: center;
    }

    p{
      text-align: center;
    }

    .row{
      display: flex;
      flex-direction: column;
      gap: 20px;
    }


    .home-banner{
      
      height:auto;
    }

    

    .home-banner .row{
      display: flex;
      flex-direction: column;
      gap: 30px;
      flex-direction: column-reverse;
    }

    .home-banner .home-cta{
      text-align: center;
    }

     .footer{
      text-align: center;
     }
  
    
  }

.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}

@media (min-width: 768px) {
.bd-placeholder-img-lg {
    font-size: 3.5rem;
}
}  