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

body {
    font-family: Poppins;
    /* font-size: 1.2rem!important; */

    --swiper-navigation-size: 30px;
    --swiper-navigation-sides-offset: 10px;
    --swiper-navigation-color: #000;
}

p {
    font-weight: 300;
    font-size: 16px!important;
}

h1,h2,h3,h4,h5,h6 {
    padding-top: 20px;
    padding-bottom: 10px;
    font-weight: 500;
    display: block;
    width: 100%;
}

h1 {
    font-size: 42px;
}

h2 {
    font-size: 32px;
}

h3 {
    font-size: 22px;
}

h4 {
    font-size: 20px;
}

h5 {
    font-size: 16px;
}

h6 {
    font-size: 14px;
}

nav li {
    font-size: 16px;
}

.bg-primary,
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active,
footer {
    background-color: #1976d2!important;
}

footer ul {
    list-style: none;
    padding: 0;
    font-size: 16px;
}

#home,
.bg-gradient-blue {
    background: -webkit-linear-gradient(0deg, #1976D2 10%, #3ea7ff 100%)
}

.bg-generic {
    background: #f9f9ff
}

#mission h2,
#client h2,
#contact h2 {
    font-size: 42px;
}

.btn-consult {
    background: #5cb85c;
    border-radius: 100px;
    padding-left: 35px!important;
    padding-right: 35px!important;
    color: #fff;
}

.btn-consult:hover {
    background: #449d44;
    color: #fff;
}

.b-circle {
    width: 95px;
    font-size: 32px;
    border: 1px solid #5cb85c;
    padding: 30px 30px;
    border-radius: 80px;
    color: #5cb85c;
}

.b-circle:hover {
    background: #5cb85c;
    transition: all 0.2s ease;
    color: #fff;
}

.main-banner {
    opacity: 0; /* Start with banners hidden */
    transform: translateY(30px); /* Initial position */
    transition: opacity 0.5s, transform 0.5s; /* Smooth transition for opacity and transform */
}

.main-banner-show {
    opacity: 1; /* Make the element visible */
    transform: translateY(0); /* Reset the transform to trigger the animation */
}


.mission-item {
    opacity: 0;
    transform: translate3d(-100%, 0, 0);
    transition: opacity 600ms 200ms,transform 500ms;
    /* animation: fadeInLeft 900ms ease-in-out; */
}

.mission-item-show {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    /* animation: fadeInLeft 400ms ease-in; */
}

.service-item {
    background: #f9f9ff;
    padding: 30px 20px;
    margin-bottom: 35px;
    opacity: 0;
    transform: translate3d(0, -100%, 0);
    transition: opacity 500ms, transform 500ms;
}
.service-item-show {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}


.service-item .b-circle {
    width: 95px;
    font-size: 32px;
    padding: 28px 30px;
    border-radius: 80px;
    border: 1px solid #a7a7a7;
    color: #a7a7a7;
}

.service-item .b-circle:hover {
    color: #fff;
}

.service-item a {
    color: #212529;
    text-decoration: none;
}

.service-item a:hover {
    color: #1976d2!important;
}

/* blog */
.progress-readtime {
  position: fixed;
  z-index: 1;
  width: 100%;
  background-color: #1976d2;
}

.progress-container {
  width: 100%;
  height: 8px;
  background: #f1f1f1;
}

.progress-bar {
  height: 8px;
  background: #1976d2;
  width: 0%;
}

/* inner pages */
.inner-pages h1 {
    font-size: 28px!important;
}

.inner-pages h2 {
    font-size: 28px!important;
}

.inner-pages h1, .inner-pages p {
    animation: fadeInUp 900ms ease-in-out;
}
/* display block on hover*/
.dropdown:hover>.dropdown-menu {
  display: block;
}

/* tmp */

main ul {
    width: 100%;
    display: block;
}

.img-fluid {
    height: auto!important;
}

/* testimonial */
.testimonial{
    opacity: 0;
    transition: opacity 0.6s ;
}

.testimonial-1 {
    background: #fff;
    padding: 14px;
    color: #000
}

.col-md-4 {
    margin-top: 25px
}

.name {
    font-weight: 700;
    font-size: 14px;
    margin-bottom: -3px
}

.place {
    font-size: 13px;
    color: #988c8c
}

.place-2 {
    font-size: 13px;
    color: #ffffff
}

.testimonial-2 {
    background: #5cb85c;
    padding: 14px;
    color: #fff
}
 .section-header h3 {
     font-size: 36px;
     color: #283d50;
     text-align: center;
     font-weight: 500;
     position: relative
 }

 .section-header p {
     text-align: center;
     margin: auto;
     font-size: 15px;
     padding-bottom: 60px;
     color: #556877;
     width: 50%
 }

 #clients {
     padding: 60px 0
 }

 #clients .clients-wrap {
     border-top: 1px solid #d6eaff;
     border-left: 1px solid #d6eaff;
     margin-bottom: 30px
 }

 #clients .client-logo {
     padding: 64px;
     display: -webkit-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     justify-content: center;
     -webkit-box-align: center;
     -webkit-align-items: center;
     -ms-flex-align: center;
     align-items: center;
     border-right: 1px solid #d6eaff;
     border-bottom: 1px solid #d6eaff;
     overflow: hidden;
     background: #fff;
     height: 160px
 }

 #clients img {
     transition: all 0.4s ease-in-out
 }

 .blog-grids {
    overflow: hidden;
    margin: 0 -15px;
}

.blog-grids .grid {
    background-color: #fff;
    width: calc(33.33% - 30px);
    float: left;
    padding: 15px;
    margin: 20px 15px 15px;
    border-radius: 10px;

}

.entry-media img {
    border-radius: 10px;
    width: 100%;
    max-height: 188px;
}

.entry-body {
    padding: 27px 10px;
}

.entry-body .cat {
    font-family: "Poppins", sans-serif;
    font-size: 12px;
    font-weight: 600;
    color: #1976d2;
    text-transform: uppercase;
}

.entry-body h3 {
    font-size: 21px;
    font-weight: 600;
    line-height: 1.30em;
    margin: 3px 0 0.73em;
}

.entry-body h3 a {
    color: #212529;
}

.entry-body h3 a:hover {
    color: #1976d2;
    text-decoration: none;
}

.entry-body p {
    margin-bottom: 2em;
    color: #90949a;
    line-height: 1.8em;
}

.read-more-date {
    position: relative;
}

.read-more-date a {
    font-family: "Poppins", sans-serif;
    font-size: 16px;
    font-size: 1.06667rem;
    font-weight: 600;
    color: #41516a;
    text-transform: uppercase;
}

.read-more-date .date {
    position: absolute;
    right: 0;
    color: #90949a;
}

@media only screen and (max-width: 991px) {
    h1, h2 {
        font-size: 32px!important;
    }

    h3, h4, h5, h6 {
        font-size: 22px!important;
    }
}

@media only screen and (max-width: 767px) {
    #home,
    #mission,
    .inner-pages section {
        text-align: center!important;
    }
    .img-50 {
        max-width: 50%!important;
    }

}

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

    body {
        font-size: 16px!important;
    }

    h1, h2 {
        font-size: 32px!important;
    }

    h3, h4, h5, h6 {
        font-size: 22px!important;
    }



}


/* Backend table */
.table-bordered th,
.table-bordered td {
    font-size: 1rem!important;
}

.about-right {
    opacity: 0;
    transition: opacity 0.6s ;
}

.case-study {
    opacity: 0;
    transition: opacity 0.6s ;
}

.show {
    opacity: 1;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0, 100%, 0);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.card-header{
    transition: background-color 0.3s;
}
.card-header button{
    color:#000;
    text-decoration: none;
    outline: none;

}
.card-header button:hover, .card-header button:focus, .card-header button:active{
    text-decoration: none;
    outline: none;
}

.card-header.active{
    background-color: #5cb85c !important;
}
.card-header.active button{
    color:#fff;
    outline: none;
    box-shadow: none;
}