﻿#navbar {
    box-shadow: 2px 2px 2px 1px rgb(0 0 0 / 20%);   
    background: #fcfbfb;
   }
.navbar img {
    width: 20rem;
}

/* media query */
@media screen and (max-width: 920px) {
   .navbar img {
    width: 10rem;
}
}

.carousel-item h5 {
    font-size: 52px;
    margin-top: -54rem;
}

.hero {
    width: 100%;
    margin-top: 3%;
    background: linear-gradient(#fffdfd, #ff944b);
}
.hero .content {
    width: 100%;
    padding: 0% 20%;
    margin-top: 18%;
}

.hero .image {
    width: 100%;
    padding: 0% 0%;    
}
.hero img {
    width: 100%;
}
.hero h2 {
    font-weight: 700;
    text-align: left;
}
.hero p{
    font-size: 16px;
}

.hero button {
    background-color: #eb5d28;
    padding: 1% 2%;
    border-radius: 5px;
    text-decoration: none;
    color: #fff;
    font-weight: 600;
    transition: 0.5s ease-in-out;
}
.hero button:hover {
    background: #fa7c28;
    text-decoration: none;
    color: #fff;
    font-weight: 600;
}

/* media query */
@media screen and (max-width: 920px) {
.hero .image {
    width: 100%;
    padding: 0% 0%;    
}

  .hero img {
    width: 100%;
}

.hero .content {
   
    padding: 0% 0%;
 
  }
}


.about {
    padding:5% 0%;
}
.about #col-1 {
    border-right: 2px solid orange;
    padding: 1% 5%
}
.about #col-2 {
   padding: 1% 5%;
}
.about h1 {
    font-weight: 700;
    color: #232e6c;
}
.about span {
    color: #eb5d28;
}
.about p {
    font-style: italic;
}
.about img {
    width: 40rem;
    height: 28rem;

}

@media screen and (max-width: 1220px) {
  .about img {
    width: 100%;
height: initial;
}
}

.products {
    padding:5% 0%;
}
.products #card {
    border-radius: 5px;
    border: 1px solid #b5b5b5;
    margin: 4% 2%;
}
.products #card h2 {
    font-size: 20px;
    font-weight: 600;
    margin: 4% 4%;
}
.products img{
    width: 100%;
}

.owl-carousel .owl-item img {
    display: block;
    width: 100%;
    /* border-radius: 1rem; */
    border: 2px solid #cda45e;
}
.brands #card {
    text-align: center;
}
.brands #card img {
    width: 50%;
    margin: 4% 0%;
  
}
.why-us {
    padding: 5% 0%;

}
.why-us h1 {
    font-weight: 700;
    padding-bottom: 2%;
    margin: 0% 2%;
    color: #232e6c;
}
.why-us span {
    color: #eb5d28;
}
.why-us .card {
    padding: 4% 4%;
    border: grey solid 0.5px;
    margin: 4% 2%;
}
.why-us h3 {
    font-weight: 700;
    font-size: 18px;
    margin-bottom: 2%;
    color: #eb5d28;
}

.why-us p {
    font-size: 16px;
    color: grey;    
}

.testimonials .section-title h1 {
   
    font-weight: 700;
    color: #232e6c;
}
.testimonials .section-title span {
    color: #eb5d28;
  
}
.testimonials .card {
    margin: 2% 2%;
}
.testimonials h2 {
    font-size: 18px;
    font-weight: 600;
    margin: 2% 2%;
}
.testimonials p {
    
    font-weight: 400;
    margin: 2% 2%;
}

footer {
       background: linear-gradient(#f47300, #ff944b);
    color: #fff;
}
.footer {
    padding: 2%;
}
.footer h2 {
    font-size: 18px;
    font-weight: 600;
}
.footer p {
    font-size: 14px;
    font-weight: 400;
}
.footer-copy-rights {
    background: #f47300;
}
.footer-copy-rights .copyright {
    padding: 2% 0%;
    text-align: center;
    background: #f47300;
    width:100%;

}
.footer-copy-rights  h4 {
    font-size: 14px;
    color: #fff;
}
.footer-copy-rights  span {
    font-weight: 700;
    color: #fff;
}