/* =================================
   SERVICE HERO
================================= */

.service-hero{
    position:relative;
    min-height:600px;
    background:url('../images/banner/biosafety-banner.jpg')
               center center/cover;
    display:flex;
    align-items:center;
}

.service-hero .overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.60);
}

.hero-content{
    position:relative;
    z-index:2;
    max-width:750px;
    color:#fff;
}

.hero-content h1{
    font-size:3rem;
    font-weight:800;
}

.hero-content p{
    font-size:1.1rem;
    margin:25px 0;
}

/* =================================
   BUTTON
================================= */

.btn-hona{
    background:#00742D;
    color:#fff;
    border:none;
    padding:14px 35px;
}

.btn-hona:hover{
    background:#DC7A33;
    color:#fff;
}

/* =================================
   SECTIONS
================================= */

.section-padding{
    padding:100px 0;
}

.section-title{
    font-weight:800;
    color:#00742D;
}

/* =================================
   CARDS
================================= */

.service-card{
    background:#fff;
    padding:35px;
    border-radius:20px;
    text-align:center;
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    transition:.3s;
}

.service-card:hover{
    transform:translateY(-8px);
}

.service-card i{
    font-size:50px;
    color:#DC7A33;
    margin-bottom:20px;
}

/* =================================
   PROCESS
================================= */

.process-box{
    text-align:center;
}

.process-box span{
    width:80px;
    height:80px;
    background:#00742D;
    color:#fff;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:auto;
    font-size:26px;
    font-weight:700;
}

/* =================================
   CTA
================================= */

.cta-section{
    background:#00742D;
    color:#fff;
    padding:80px 0;
}

/* =================================
   INDUSTRIES
================================= */

.industry-box{
    background:#fff;
    padding:30px;
    text-align:center;
    border-radius:15px;
    box-shadow:0 10px 25px rgba(0,0,0,.08);
}

/* =================================
   CONSULTATION
================================= */

.consultation-form{
    background:#fff;
    padding:40px;
    border-radius:20px;
    box-shadow:0 15px 40px rgba(0,0,0,.08);
}

/* =================================
   MOBILE
================================= */

@media(max-width:768px){

.hero-content h1{
    font-size:2rem;
}

.section-padding{
    padding:70px 0;
}

}