h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
     font-family: 'PT Sans', sans-serif
 }
 
 p {
     font-family: 'PT Sans', sans-serif
 }
 
 li,
 ul {
     font-family: 'PT Sans', sans-serif;
     list-style: none
 }
 
 ul {
     padding: 0
 }
 
 .top-header {
     background-color: #296de5;
     height: auto;
     padding: 0px
 }
 
 .mobile-topheader {
     display: none
 }
 
 @media (max-width:576px) {
     .mobile-topheader {
         display: block;
         padding: 5px;
     }
 }
 
 .social-links {
     list-style: none;
     margin: 0
 }
 
 .social-links li {
     display: inline-block
 }
 
 .social-links a {
     display: inline-block;
     padding: 3px;
     background-color: #fff;
     margin-top: 8px;
     margin-left: 4px;
     width: 30px;
     font-size: 16px;
     text-align: center;
     color: #000
 }
 
 @media (max-width:576px) {
     .social-links a {
         display: inline-block;
         padding: 2px;
         background-color: #fff;
         margin-top: 8px;
         margin-left: 1px;
         width: 21px;
         font-size: 12px;
         text-align: center;
         color: #000
     }
 }
 
 .social-links a:hover {
     color: #000
 }
 
 .search-container input[type=text] {
     padding: 6px;
     margin-top: 5px;
     font-size: 17px;
     border: none;
     width: 70%;
     border-radius: 3px;
     background-color: #fff
 }
 
 .search-container button {
     padding: 6px 10px;
     margin-top: 5px;
     margin-right: 20px;
     font-size: 17px;
     border-radius: 3px;
     border: none;
     background-color: #fff;
     cursor: pointer
 }
 
 .contact-links {
     list-style: none;
     float: right
 }
 
 .contact-links li {
     display: inline-block
 }
 
 .contact-links a {
     display: inline-block;
     margin-top: 9px;
     margin-left: 15px;
     font-size: 16px;
     color: #fff
 }
 
 @media (max-width:576px) {
     .contact-links a {
         display: inline-block;
         margin-top: 9px;
         margin-left: 15px;
         font-size: 10px;
         color: #fff
     }
 }
 
 .contact-links a:hover {
     color: #fff;
     text-decoration: none
 }
 
 .nav-link {
     color: #000;
     transition: .5s;
     font-weight: 400;
     text-align: center
 }
 
 .nav-item {
     padding: 3px
 }
 
 @media only screen and (max-width:1024px) {
     .nav-item {
         padding: 0;
         font-size: 12px
     }
 }
 
 .active a {
     background-color: #296de5;
     padding: 8px;
     color: #fff;
     border-radius: 25px
 }
 
 .nav-link:hover {
     background-color: #296de5;
     padding: 8px;
     color: #fff;
     border-radius: 25px
 }
 
 .header-line h2 {
     text-align: center;
     margin-top: 50px;
     font-weight: 700
 }
 
 @media (max-width:576px) {
     .header-line h2 {
         font-size: 22px
     }
 }
 
 .header-line-1 {
     width: 70px;
     height: 1px;
     margin: auto;
     background-color: #000
 }
 
 .header-line-2 {
     width: 40px;
     height: 1px;
     margin: auto;
     background-color: #000;
     margin-top: 4px
 }
 
 .header-line h3 {
     text-align: center;
     margin-top: 40px;
     font-weight: 600
 }
 
 @media (max-width:576px) {
     .header-line h3 {
         font-size: 15px
     }
 }
 
 .header-line h1 {
     text-align: center;
     margin-top: 40px;
     font-weight: 600;
     font-size: 1.75rem;
 }
 
 @media (max-width:576px) {
     .header-line h1 {
         font-size: 15px
     }
 }
 
 .header-line p {
     text-align: center;
     margin-top: 5px;
     font-size: 17px
 }
 
 @media (max-width:576px) {
     .header-line p {
         font-size: 13px
     }
 }
 
 .header-line ul {
     list-style: none;
     text-align: center;
     margin-top: 20px
 }
 
 .header-line li {
     font-weight: 700;
     font-size: 18px
 }
 
 @media (max-width:576px) {
     .header-line li {
         font-weight: 700;
         font-size: 10px
     }
 }
 
 .product-box {
     border: 1px solid #eee;
     margin-top: 20px
 }
 
 .product-image-box {
     background-color: #fff;
     overflow: hidden
 }
 
 .product-image-box img {
     width: 100%
 }
 
 .product-name {
     min-height: 65px;
     background-color: #eee;
     padding-top: 15px;
     padding-bottom: 10px
 }
 
 .product-name h5 {
     text-align: center;
     text-transform: capitalize;
     font-size: 15px;
     font-weight: 600
 }

 @media (max-width:576px){
     .product-name h5{
         font-size: 13px;
         height: 40px;
     }
 }
 
 .about-back-color {
     background-color: #f5f5f5;
     margin-top: 130px;
     height: auto
 }

 @media (max-width:576px){
    .about-back-color {
        background-color: #f5f5f5;
        margin-top: 30px;
        height: auto;
    }
}

 
 .cor-line h2 {
     text-align: center;
     margin-top: 50px
 }
 
 .cor-line h2:after {
     content: '';
     border-bottom: 1px solid #000;
     width: 53px;
     position: absolute;
     margin-top: 56px;
     margin-left: -156px
 }
 
 .cor-line h2:before {
     content: '';
     border-bottom: 1px solid #000;
     width: 81px;
     position: absolute;
     margin-top: 50px;
     margin-left: 112px
 }
 
 .about-back {
     background-color: #fff;
     height: auto
 }
 
 .about-line h2 {
     text-align: center;
     margin-top: 50px
 }
 
 .about-line h2:after {
     content: '';
     border-bottom: 1px solid #000;
     width: 53px;
     position: absolute;
     margin-top: 56px;
     margin-left: -97px
 }
 
 .about-line h2:before {
     content: '';
     border-bottom: 1px solid #000;
     width: 81px;
     position: absolute;
     margin-top: 50px;
     margin-left: 40px
 }
 
 .about-content {
     margin-top: 30px
 }
 
 .hover-icons {
     width: 150px;
     height: 150px;
     border-radius: 50%;
     border: 2px solid #d3d3d3;
     margin: auto;
     margin-top: 85px
 }


 
 .hover-icons img {
     width: 78px;
     margin-top: 30px
 }

 @media (max-width:576px){
    .hover-icons{
       width: 100px;
       height: 100px;
       margin-top: 20px !important;
    }
    .hover-icons img {
        width: 50px;
        margin-top: 25px;
    }
}
 
 .fa-icons h4 {
     text-align: center;
     text-transform: uppercase;
     margin-top: 30px;
     font-size: 18px;
     font-weight: 700
 }
 
 .fa-icons p {
     text-align: center
 }
 
 .assist {
     background-color: #296de5;
     height: auto;
     margin-top: 50px;
     padding: 40px
 }
 
 .connect-content {
     display: flex
 }
 
 .connect-content i {
     color: #fff;
     font-size: 50px;
     border: 1px solid #fff;
     padding: 10px
 }
 
 .connect-content h3 {
     color: #fff;
     margin-left: 10px;
     font-size: 20px;
     font-weight: 600;
     font-family: 'PT Sans', sans-serif
 }
 
 .connect-content p {
     position: absolute;
     color: #fff;
     margin-top: 26px;
     margin-left: 90px
 }
 
 .connect-button a {
     float: right;
     color: #000;
     background-color: #eee;
     border-color: #d0d0d0;
     padding: 14px;
     text-align: center;
     width: 120px;
     border-radius: 6px;
     margin-top: 10px
 }
 
 @media (max-width:576px) {
     .connect-button a {
         float: right;
         color: #000;
         background-color: #eee;
         border-color: #d0d0d0;
         padding: 14px;
         text-align: center;
         width: 120px;
         border-radius: 6px;
         margin-top: 90px;
         margin-right: 50px
     }
 }
 
 .connect-button a:hover {
     color: #000;
     text-decoration: none
 }
 
 .slick-slide {
     margin: 0 20px
 }
 
 .slick-slide img {
     width: 100%
 }
 
 .slick-slider {
     position: relative;
     display: block;
     box-sizing: border-box;
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
     -webkit-touch-callout: none;
     -khtml-user-select: none;
     -ms-touch-action: pan-y;
     touch-action: pan-y;
     -webkit-tap-highlight-color: transparent
 }
 
 .slick-list {
     position: relative;
     display: block;
     overflow: hidden;
     margin: 0;
     padding: 0
 }
 
 .slick-list:focus {
     outline: 0
 }
 
 .slick-list.dragging {
     cursor: pointer;
     cursor: hand
 }
 
 .slick-slider .slick-list,
 .slick-slider .slick-track {
     -webkit-transform: translate3d(0, 0, 0);
     -moz-transform: translate3d(0, 0, 0);
     -ms-transform: translate3d(0, 0, 0);
     -o-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0)
 }
 
 .slick-track {
     position: relative;
     top: 0;
     left: 0;
     display: block
 }
 
 .slick-track:after,
 .slick-track:before {
     display: table;
     content: ''
 }
 
 .slick-track:after {
     clear: both
 }
 
 .slick-loading .slick-track {
     visibility: hidden
 }
 
 .slick-slide {
     display: none;
     float: left;
     height: 100%;
     min-height: 1px
 }
 
 [dir=rtl] .slick-slide {
     float: right
 }
 
 .slick-slide img {
     display: block
 }
 
 .slick-slide.slick-loading img {
     display: none
 }
 
 .slick-slide.dragging img {
     pointer-events: none
 }
 
 .slick-initialized .slick-slide {
     display: block
 }
 
 .slick-loading .slick-slide {
     visibility: hidden
 }
 
 .slick-vertical .slick-slide {
     display: block;
     height: auto;
     border: 1px solid transparent
 }
 
 .slick-arrow.slick-hidden {
     display: none
 }
 
 .team-name {
     padding: 10px;
     border-bottom: 3px solid #296de5;
     height: 55px
 }
 
 .team-name:hover {
     background-color: #000;
     border-bottom: 3px solid #000;
     color: #fff
 }
 
 .team-name h5 {
     font-weight: 700;
     font-size: 15px
 }
 
 .footer-color {
     background-color: #f3f3f3!important;
     height: auto;
     padding: 40px
 }
 
 .company-name h5 {
     font-size: 18px;
     font-weight: 600;
     border-bottom: 1px solid #000;
     padding: 10px
 }
 
 .footer-line {
     width: 60px;
     height: 2px;
     position: absolute;
     background-color: #296de5;
     margin-top: -11px
 }
 
 .add-social h5 {
     font-size: 14px;
     margin-top: 10px;
     font-weight: 600
 }
 
 .footer-contact {
     list-style: none
 }
 
 .footer-contact li {
     margin-top: 10px
 }
 
 .footer-contact li a {
     color: #000;
     font-size: 14px;
     font-weight: 600
 }
 
 .footer-contact li a:hover {
     text-decoration: none
 }
 
 .footer-city {
     list-style: square
 }
 
 .footer-city li {
     display: inline;
     font-size: 14px;
     font-weight: 600;
     margin-left: 10px
 }
 
 .footer-social {
     list-style: none;
     margin-top: 130px
 }

 @media (max-width:576px){
    .footer-social {
        list-style: none;
        margin-top: 85px
    }
 }
 
 .footer-social li {
     display: inline
 }
 
 .footer-social a {
     display: inline-block;
     padding: 3px;
     border: 1px solid #666;
     width: 35px;
     height: 35px;
     font-size: 16px;
     text-align: center;
     color: #000;
     border-radius: 50%;
     transition: .5s
 }
 
 .footer-social a:hover {
     background-color: #666;
     color: #fff
 }
 
 .footer-bottom-color {
     background-color: #000;
     padding: 10px
 }
 
 .useful h5 {
     font-size: 14px;
     margin-top: 10px;
     font-weight: 600;
     border-bottom: 1px solid #000;
     padding: 10px
 }
 
 .useful-links {
     list-style: none
 }
 
 .useful-links li {
     border-bottom: 1px dotted #000;
     padding: 6px
 }
 
 .useful-links a {
     color: #000;
     font-size: 16px
 }
 
 @media (max-width:576px) {
     .useful-links a {
         color: #000;
         font-size: 13px
     }
 }
 
 .useful-links a:hover {
     color: #000;
     text-decoration: none
 }
 
 .footer-submit {
     background-color: green;
     color: #fff!important;
     border: none;
     height: 30px;
     width: 70px
 }
 
 .footer-submit:hover {
     background-color: orange
 }
 
 .image-box {
     border: none;
     height: none;
     width: 100%;
     overflow: hidden;
     /* height: 312px */
 }
 
 .image-box img {
     width: 100%
 }
 
 .date-admin {
     padding: 10px
 }
 
 .date-admin li {
     display: inline;
     font-size: 13px
 }
 
 .about-header-image h2 {
     color: #21b672;
     font-weight: 700;
     font-size: 40px;
     padding-top: 200px
 }
 
 .about-header-image h1 {
     color: #21b672;
     font-weight: 700;
     font-size: 40px;
     padding-top: 200px
 }
 
 .about-title h3 {
     font-weight: 700;
     margin-top: 50px;
     font-size: 25px
 }
 
 .about-title h1 {
     font-weight: 700;
     margin-top: 50px;
     font-size: 25px
 }
 
 .about-bottom-line {
     width: 56px;
     height: 2px;
     background-color: #000
 }
 
 .about-content1 p {
     font-size: 18px;
     color: #666;
     margin-top: 30px
 }
 
 @media (max-width:576px) {
     .about-content1 p {
         font-size: 13px
     }
 }
 
 .about-team h5 {
     font-size: 15px;
     font-weight: 700;
     margin-top: 10px
 }
 
 .about-why {
     background-color: #f7f8fa;
     height: auto;
     margin-top: 50px
 }
 
 .section-content {
     padding-top: 60px;
     padding-bottom: 60px
 }
 
 .about-why-title h3 {
     font-weight: 700;
     font-size: 25px
 }
 
 .aboutus-list ul {
     margin-top: 15px
 }
 
 .aboutus-list li {
     list-style: square;
     color: orange;
     font-size: 16px
 }
 
 .aboutus-list li span {
     color: #000
 }
 
 .mySlides {
     margin-top: 20px;
     background-color: #fff;
     height: auto;
     padding: 15px
 }
 
 .mySlides img {
     border-radius: 50%;
     height: 75px;
     width: 88px
 }
 
 .mySlides p {
     margin-left: 10px
 }
 
 .prev {
     cursor: pointer;
     position: absolute;
     top: 10%;
     color: #888;
     border-radius: 0 3px 3px 0;
     user-select: none;
     right: 60px;
     font-size: 12px;
     background-color: #eee;
     padding: 7px;
     width: 45px;
     text-align: center
 }
 
 .next {
     position: absolute;
     right: 0;
     cursor: pointer;
     border-radius: 3px 0 0 3px;
     top: 10%;
     width: 45px;
     background-color: #eee;
     padding: 16px;
     color: #888;
     padding: 7px;
     font-size: 12px;
     border-radius: 0 3px 3px 0;
     text-align: center;
     user-select: none
 }
 
 .next:hover,
 .prev:hover {
     color: #888;
     text-decoration: none
 }
 
 .product-header-image h1 {
     color: #21b672;
     font-weight: 700;
     font-size: 40px;
     padding-top: 200px
 }
 
 .product-header-image h2 {
     color: #21b672;
     font-weight: 700;
     font-size: 40px;
     padding-top: 200px
 }
 
 @media (max-width:576px) {
     .product-header-image h1 {
         color: #21b672;
         font-weight: 700;
         font-size: 25px;
         padding-top: 200px
     }
 }
 
 .product-detail img {
     width: 100%;
     margin-top: 20px
 }
 
 .product-detail h1 {
     font-size: 18px;
     font-weight: 700;
     margin-top: 50px
 }
 
 .product-detail-form {
     border: 1px solid #b8b7b7;
     padding: 10px;
     background-color: #fff;
     height: auto;
     margin-top: 50px
 }
 
 .animated-button {
     border-radius: 4px;
     background-color: orange;
     border: none;
     color: #fff;
     text-align: center;
     font-size: 15px;
     padding: 6px;
     width: 98px;
     transition: all .5s;
     cursor: pointer;
     margin: 0
 }
 
 .animated-button span {
     cursor: pointer;
     display: inline-block;
     position: relative;
     transition: .5s
 }
 
 .animated-button span:after {
     content: '\00bb';
     position: absolute;
     opacity: 0;
     top: 0;
     right: -20px;
     transition: .5s
 }
 
 .animated-button:hover span {
     padding-right: 25px
 }
 
 .animated-button:hover span:after {
     opacity: 1;
     right: 0
 }
 
 .tab {
     overflow: hidden;
     color: #555
 }
 
 .tab button {
     float: left;
     border: none;
     outline: 0;
     cursor: pointer;
     padding: 14px 16px;
     transition: .3s;
     font-size: 17px;
     background-color: #fff
 }
 
 .tab button.active {
    background-color: #296de5;
    border: 1px solid #296de5;
    border-bottom: none;
    color: white;
 }
 
 .tab button:hover {
    background-color: #296de5;
    border: 1px solid #296de5;
    border-bottom: none;
    color: white;
 }


 .tabcontent {
     display: none;
     padding: 6px 12px;
     border: 1px solid #eee
 }
 
 .tabcontent li {
     list-style: disc;
     margin-left: 20px;
 }
 
 .tabcontent h3 {
     font-weight: 700;
     font-size: 20px
 }
 
 .mobile-tab {
     display: none
 }
 
 @media (max-width:576px) {
     .mobile-tab {
         display: block
     }
 }
 
 .mobile-tab li {
     list-style: disc;
     margin-left: 20px;
 }
 
 .mobile-tab h3 {
     font-weight: 700;
     font-size: 20px
 }
 
 .blog-box {
     /* min-height: 465px!important; */
     margin: 20px 0px 20px 0px;
     box-shadow: 1px 1px 10px lightgrey;
     border: 1px solid lightgrey;
 }
 
 .blog-box a {
     border: 1px solid #21b672;
     padding: 7px;
     color: #000;
     border-radius: 5px;
     font-size: 12px;
     margin-left: 10px;
 }
 
 .blog-box a:hover {
     border: 1px solid orange;
     padding: 7px;
     color: #000;
     border-radius: 5px;
     font-size: 12px;
     text-decoration: none
 }
 
 .blog-header-image h1 {
     color: #21b672;
     font-weight: 700;
     font-size: 40px;
     padding-top: 200px
 }
 
 .blog-header-image2 h1 {
     color: #000;
     font-weight: 700;
     font-size: 23px;
     padding-top: 200px
 }
 
 .blog-detail img {
     width: 100%;
     margin: 30px 0px 30px 0px;
 }
 
 .blog-detail-box {
     background: #f8f8f8;
     padding: 15px;
     height: auto
 }
 
 .blog-detail-box a {
     color: #000
 }
 
 .date-box {
     padding-left: 0px !important;
 }
 
 .date-box li {
     background-color: #296de5;
     padding: 5px 15px 5px 15px;
     font-weight: 700;
 }
 
 .blog-detail-box ul {
     padding-left: 50px;
 }
 
 .blog-detail-box li {
     list-style: disc !important;
 }
 
 .blog-title-line {
     margin-left: 20px;
     font-size: 20px;
     color: #000;
     text-transform: uppercase
 }
 
 .blog-title-line span {
     font-size: 13px;
     text-transform: none;
     color: #a9a9a9
 }
 
 .blog-title-line :hover {
     color: #000;
     text-decoration: none
 }
 /* strong {
     color: #000
 } */
 
 .latest-blog h5 {
     margin-top: 20px;
     font-weight: 700;
     font-size: 15px
 }
 
 .blog-bottom-line {
     width: 60px;
     height: 2px;
     background-color: #296de5
 }
 
 .blog-bottom-line1 {
     width: 100%;
     height: 2px;
     background-color: #296de5
 }
 
 .latest-blog img {
     width: 80px;
     padding: 10px;
 }
 
 .latest-blog a {
     font-size: 16px;
     color: #000
 }
 
 .latest-blog a:hover {
     color: #296de5;
     text-decoration: none
 }
 
 .contact-header-image h1 {
     color: #21b672;
     font-weight: 700;
     font-size: 40px;
     padding-top: 200px
 }
 
 @media (max-width:576px) {
     .contact-header-image h1 {
         color: #21b672;
         font-weight: 700;
         font-size: 22px;
         padding-top: 200px
     }
 }
 
 .contact-link {
     margin-top: 50px
 }
 
 .contact-link i {
     color: #21b672;
     font-size: 50px
 }
 
 .contact-link h4 {
     text-align: center;
     margin-top: 30px;
     font-weight: 700;
     font-size: 20px
 }
 
 .contact-link h6 {
     text-align: center;
     font-weight: 700;
     font-size: 16px
 }
 
 .contact-map {
     background-color: #f7f7f7;
     height: auto;
     margin-top: 50px;
     padding: 10px
 }
 
 .contact-map-form h3 {
     font-weight: 700;
     font-size: 25px;
     padding-top: 40px
 }
 
 .category-header-image h2 {
     color: #21b672;
     font-weight: 700;
     font-size: 40px;
     padding-top: 200px
 }
 
 @media (max-width:576px) {
     .category-header-image h2 {
         color: #21b672;
         font-weight: 700;
         font-size: 25px;
         padding-top: 200px
     }
 }
 
 .category-header-image h1 {
     color: #21b672;
     font-weight: 700;
     font-size: 40px;
     padding-top: 200px
 }
 
 @media (max-width:576px) {
     .category-header-image h1 {
         color: #21b672;
         font-weight: 700;
         font-size: 25px;
         padding-top: 200px
     }
 }
 
 .item-1,
 .item-2 {
     position: absolute;
     display: block;
     top: 3em;
     width: 60%;
     animation-duration: 20s;
     animation-timing-function: ease-in-out;
     animation-iteration-count: infinite;
     background-color: #296de5;
     font-size: 2.5vw;
     border-left: 5px solid #fff;
     padding: 10px;
     color: #fff;
     margin-left: -250px;
     font-weight: 700
 }
 
 @media only screen and (max-width:768px) {
     .item-1,
     .item-2 {
         position: absolute;
         display: block;
         top: 3em;
         width: 60%;
         animation-duration: 20s;
         animation-timing-function: ease-in-out;
         animation-iteration-count: infinite;
         background-color: #296de5;
         font-size: 2.5vw;
         border-left: 5px solid #fff;
         padding: 10px;
         color: #fff;
         margin-left: -150px;
         font-weight: 700
     }
 }
 
 .item-3,
 .item-4 {
     position: absolute;
     display: block;
     top: 5em;
     width: 40%;
     animation-duration: 20s;
     animation-timing-function: ease-in-out;
     animation-iteration-count: infinite;
     font-size: 2.5vw;
     color: #fff;
     margin-left: -250px;
     font-weight: 700
 }
 
 @media only screen and (max-width:768px) {
     .item-3,
     .item-4 {
         position: absolute;
         display: block;
         top: 5em;
         width: 40%;
         animation-duration: 20s;
         animation-timing-function: ease-in-out;
         animation-iteration-count: infinite;
         font-size: 2.5vw;
         color: #fff;
         margin-left: -150px;
         font-weight: 700
     }
 }
 
 @media (max-width:576px) {
     .item-1,
     .item-2,
     .item-4,
     item-3 {
         display: none
     }
 }
 
 .item-3 {
     animation-name: anim-1
 }
 
 .item-4 {
     animation-name: anim-1
 }
 
 .item-1 {
     animation-name: anim-1
 }
 
 .item-2 {
     animation-name: anim-2
 }
 
 @keyframes anim-1 {
     0%,
     8.3% {
         left: -100%;
         opacity: 0
     }
     25%,
     8.3% {
         left: 25%;
         opacity: 1
     }
     100%,
     33.33% {
         left: 110%;
         opacity: 0
     }
 }
 
 @keyframes anim-2 {
     0%,
     8.3% {
         left: -100%;
         opacity: 0
     }
     25%,
     8.3% {
         left: 25%;
         opacity: 1
     }
     100%,
     33.33% {
         left: 110%;
         opacity: 0
     }
 }
 
 .slider-image-resp img {
     width: 100%;
     height: 450px
 }
 
 @media only screen and (max-width:768px) {
     .slider-image-resp img {
         width: 100%;
         height: 335px
     }
 }
 
 @media (max-width:576px) {
     .slider-image-resp img {
         width: 100%;
         height: 160px
     }
 }
 
 .test-header-image h2 {
     color: #21b672;
     font-weight: 700;
     font-size: 40px;
     padding-top: 200px
 }
 
 @media (max-width:576px) {
     .test-header-image h2 {
         color: #21b672;
         font-weight: 700;
         font-size: 25px;
         padding-top: 200px
     }
 }
 
 .test-image img {
     width: 150px;
     margin-top: 50px
 }
 
 .test-content-name h4 {
     font-size: 24px;
     font-weight: 700;
     margin-top: 50px
 }
 
 .test-content-name h5 {
     font-size: 15px;
     font-weight: 700;
     margin-top: 5px
 }
 
 .test-bottom-line {
     width: 100%;
     height: 2px;
     background-color: #296de5
 }
 
 .privacy-header-image h1 {
     color: #21b672;
     font-weight: 700;
     font-size: 40px;
     padding-top: 200px
 }
 
 @media (max-width:576px) {
     .privacy-header-image h1 {
         color: #21b672;
         font-weight: 700;
         font-size: 25px;
         padding-top: 200px
     }
 }
 
 .privacy-content {
     margin-top: 50px
 }
 
 .privacy-content h3 {
     font-weight: 700;
     font-size: 22px
 }
 
 .privacy-content li {
     list-style: square
 }
 
 .list-city-product {
     background-color: #99999921;
     min-height: auto;
     padding: 20px
 }
 
 .list-city-product h2 {
     padding: 0;
     font-size: 35px;
     color: #21b672;
     font-weight: 700
 }
 
 @media (max-width:576px) {
     .list-city-product h2 {
         padding: 0;
         font-size: 20px;
         color: #21b672
     }
 }
 
 .list-city-product h1 {
     padding: 0;
     font-size: 35px;
     color: #21b672;
     font-weight: 700
 }
 
 @media (max-width:576px) {
     .list-city-product h1 {
         padding: 0;
         font-size: 20px;
         color: #21b672
     }
 }
 
 .city-list p {
     font-size: 18px;
     margin-top: 30px;
     margin-bottom: 20px;
     color: #000
 }
 
 .city-list p:hover {
     color: #21b672;
     text-decoration: none
 }
 
 @media (max-width:576px) {
     .city-list p {
         font-size: 17px;
         text-align: center;
         margin-top: 20px
     }
 }
 
 .category-list {
     margin-top: 30px
 }
 
 .category-list li {
     border: 1px solid #cccccc6e;
     padding: 10px;
     font-size: 16px;
     color: #000;
     background-color: #f5f5f5;
     transition: .5s
 }
 
 .category-list li:hover {
     border: 1px solid #cccccc6e;
     padding: 10px;
     font-size: 16px;
     color: #fff;
     background-color: #21b672
 }
 
 .city-product-box {
     border: 1px solid #d3d3d3;
     height: 400px;
     margin-top: 30px
 }
 
 .city-images-box {
     border: none;
     width: 100%;
     overflow: hidden;
     height: 300px
 }
 
 .city-images-box img {
     width: 100%
 }
 
 .product-name {
     background-color: #ddd;
     padding: 10px;
     /* height: 100px */
 }
 
 .product-name h3 {
     font-size: 17px;
     padding-top: 0;
     text-align: center;
     color: #000;
     font-weight: 700
 }
 
 .desk-nav {
     display: block;
     margin-top: 4px;
 }
 
 @media (max-width:576px) {
     .desk-nav {
         display: none
     }
 }
 
 .topnav {
     overflow: hidden;
     background-color: #333;
     position: relative;
     display: none
 }
 
 @media (max-width:576px) {
     .topnav {
         display: block
     }
 }
 
 .topnav #myLinks {
     display: none
 }
 
 .topnav a {
     color: #fff;
     padding: 14px 16px;
     text-decoration: none;
     font-size: 17px;
     display: block
 }
 
 .topnav a.icon {
     background: #000;
     display: block;
     position: absolute;
     right: 0;
     top: 0
 }
 
 .topnav a:hover {
     background-color: #ddd;
     color: #000
 }
 
 .topnav {
     overflow: hidden;
     background-color: #f8f9fa;
     position: relative;
     padding: 10px
 }
 
 .topnav #myLinks {
     display: none
 }
 
 .topnav-links a {
     color: #000;
     padding: 2px 5px;
     text-decoration: none;
     font-size: 12px;
     display: block;
     margin-top: 10px;
     border-bottom: 1px dotted #000
 }
 
 .topnav a.icon {
     display: block;
     position: absolute;
     right: 10px;
     top: 22px;
     background-color: transparent
 }
 
 .topnav-links a:hover {
     background-color: #296de5;
     color: #fff;
     text-decoration: none
 }
 
 ul.list.angle-double-right li:before {
     content: "\f101";
     font-family: fontawesome;
     font-size: 12px
 }
 
 ul.list li:before {
     border: none;
     color: #a9a9a9!important;
     content: "\f0a9";
     display: inline-block;
     font-family: fontawesome;
     font-size: 12px;
     margin-right: 10px;
     padding: 0
 }
 
 .list a {
     color: #000!important
 }
 
 .list a:hover {
     text-decoration: none
 }
 
 .mobile-logo {
     display: none
 }
 
 .mobile-logo img {
     width: 100%;
     margin-top: 30px
 }
 
 @media (max-width:576px) {
     .mobile-logo {
         display: block
     }
 }
 
 .page-error {
     background-color: #6666;
     border-radius: 30px;
     padding: 10px;
     color: #fff
 }
 
 .page-error:hover {
     background-color: #6666;
     border-radius: 30px;
     padding: 10px;
     color: #fff;
     text-decoration: none
 }
 
 .list-border li {
     border-bottom: 1px dotted #000;
     padding: 10px
 }
 
 .list-border a {
     color: #000
 }
 
 .list-border a:hover {
     color: #000;
     text-decoration: none
 }
 
 .mobile-team-image {
     display: none
 }
 
 .mobile-team-image img {
     margin-top: 10px;
     border-radius: 5px
 }
 
 @media (max-width:576px) {
     .mobile-team-image {
         display: block
     }
 }
 
 #myImg {
     border-radius: 5px;
     cursor: pointer;
     transition: .3s
 }
 
 #myImg:hover {
     opacity: .7
 }
 
 .modal {
     display: none;
     position: fixed;
     z-index: 1;
     padding-top: 100px;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     overflow: auto;
     background-color: #000;
     background-color: rgba(0, 0, 0, .9)
 }
 
 .modal-content {
     margin: auto;
     display: block;
     width: 80%;
     max-width: 700px
 }
 
 #caption {
     margin: auto;
     display: block;
     width: 80%;
     max-width: 700px;
     text-align: center;
     color: #ccc;
     padding: 10px 0;
     height: 150px
 }
 
 #caption,
 .modal-content {
     -webkit-animation-name: zoom;
     -webkit-animation-duration: .6s;
     animation-name: zoom;
     animation-duration: .6s
 }
 
 @-webkit-keyframes zoom {
     from {
         -webkit-transform: scale(0)
     }
     to {
         -webkit-transform: scale(1)
     }
 }
 
 @keyframes zoom {
     from {
         transform: scale(0)
     }
     to {
         transform: scale(1)
     }
 }
 
 .close {
     position: absolute;
     top: 15px;
     right: 35px;
     color: #f1f1f1;
     font-size: 40px;
     font-weight: 700;
     transition: .3s
 }
 
 .close:focus,
 .close:hover {
     color: #bbb;
     text-decoration: none;
     cursor: pointer
 }
 
 @media only screen and (max-width:700px) {
     .modal-content {
         width: 100%
     }
 }
 
 .close2 {
     position: absolute;
     top: 15px;
     right: 35px;
     color: #f1f1f1;
     font-size: 40px;
     font-weight: 700;
     transition: .3s
 }
 
 .close2:focus,
 .close2:hover {
     color: #bbb;
     text-decoration: none;
     cursor: pointer
 }
 
 .close3 {
     position: absolute;
     top: 15px;
     right: 35px;
     color: #f1f1f1;
     font-size: 40px;
     font-weight: 700;
     transition: .3s
 }
 
 .close3:focus,
 .close3:hover {
     color: #bbb;
     text-decoration: none;
     cursor: pointer
 }
 
 #caption2 {
     margin: auto;
     display: block;
     width: 80%;
     max-width: 700px;
     text-align: center;
     color: #ccc;
     padding: 10px 0;
     height: 150px
 }
 
 #caption2,
 .modal-content {
     -webkit-animation-name: zoom;
     -webkit-animation-duration: .6s;
     animation-name: zoom;
     animation-duration: .6s
 }
 
 @-webkit-keyframes zoom {
     from {
         -webkit-transform: scale(0)
     }
     to {
         -webkit-transform: scale(1)
     }
 }
 
 #caption3 {
     margin: auto;
     display: block;
     width: 80%;
     max-width: 700px;
     text-align: center;
     color: #ccc;
     padding: 10px 0;
     height: 150px
 }
 
 #caption3,
 .modal-content {
     -webkit-animation-name: zoom;
     -webkit-animation-duration: .6s;
     animation-name: zoom;
     animation-duration: .6s
 }
 
 @-webkit-keyframes zoom {
     from {
         -webkit-transform: scale(0)
     }
     to {
         -webkit-transform: scale(1)
     }
 }
 
 .close4 {
     position: absolute;
     top: 15px;
     right: 35px;
     color: #f1f1f1;
     font-size: 40px;
     font-weight: 700;
     transition: .3s
 }
 
 .close4:focus,
 .close4:hover {
     color: #bbb;
     text-decoration: none;
     cursor: pointer
 }
 
 #caption4 {
     margin: auto;
     display: block;
     width: 80%;
     max-width: 700px;
     text-align: center;
     color: #ccc;
     padding: 10px 0;
     height: 150px
 }
 
 #caption4,
 .modal-content {
     -webkit-animation-name: zoom;
     -webkit-animation-duration: .6s;
     animation-name: zoom;
     animation-duration: .6s
 }
 
 @-webkit-keyframes zoom {
     from {
         -webkit-transform: scale(0)
     }
     to {
         -webkit-transform: scale(1)
     }
 }
 
 .close5 {
     position: absolute;
     top: 15px;
     right: 35px;
     color: #f1f1f1;
     font-size: 40px;
     font-weight: 700;
     transition: .3s
 }
 
 .close5:focus,
 .close5:hover {
     color: #bbb;
     text-decoration: none;
     cursor: pointer
 }
 
 #caption5 {
     margin: auto;
     display: block;
     width: 80%;
     max-width: 700px;
     text-align: center;
     color: #ccc;
     padding: 10px 0;
     height: 150px
 }
 
 #caption5,
 .modal-content {
     -webkit-animation-name: zoom;
     -webkit-animation-duration: .6s;
     animation-name: zoom;
     animation-duration: .6s
 }
 
 @-webkit-keyframes zoom {
     from {
         -webkit-transform: scale(0)
     }
     to {
         -webkit-transform: scale(1)
     }
 }
 
 .close6 {
     position: absolute;
     top: 15px;
     right: 35px;
     color: #f1f1f1;
     font-size: 40px;
     font-weight: 700;
     transition: .3s
 }
 
 .close6:focus,
 .close6:hover {
     color: #bbb;
     text-decoration: none;
     cursor: pointer
 }
 
 #caption6 {
     margin: auto;
     display: block;
     width: 80%;
     max-width: 700px;
     text-align: center;
     color: #ccc;
     padding: 10px 0;
     height: 150px
 }
 
 #caption6,
 .modal-content {
     -webkit-animation-name: zoom;
     -webkit-animation-duration: .6s;
     animation-name: zoom;
     animation-duration: .6s
 }
 
 @-webkit-keyframes zoom {
     from {
         -webkit-transform: scale(0)
     }
     to {
         -webkit-transform: scale(1)
     }
 }
 
 .icon {
     color: #000
 }
 
 .rating span:hover {
     color: orange
 }
 
 .fluid-width-video-wrapper iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%
 }
 
 .download span {
     color: #000
 }
 
 .download span:hover {
     color: #666
 }
 
 #more {
     display: none
 }
 
 #suggestion-box {
     position: absolute;
     z-index: 1;
     margin-left: 40px;
     margin-top: 7px;
     padding: 10px;
     height: 250px;
     overflow-y: auto
 }
 
 #suggestion-box li {
     list-style: none;
     color: #000;
     border-bottom: 1px dotted #000;
     padding: 10px
 }
 
 #suggestion-box li:hover {
     background-color: #f5f5f5
 }
 
 #suggestion-box a {
     text-decoration: none
 }
 
 #suggestion-box a:hover {
     text-decoration: none
 }

 #suggestion-box1 {
    position: absolute;
    z-index: 1;
    /* margin-left: 40px; */
    margin-top: 7px;
    padding: 10px;
    height: 250px;
    overflow-y: auto
}

#suggestion-box1 li {
    list-style: none;
    color: #000;
    border-bottom: 1px dotted #000;
    padding: 10px
}

#suggestion-box1 li:hover {
    background-color: #f5f5f5
}

#suggestion-box1 a {
    text-decoration: none
}

#suggestion-box1 a:hover {
    text-decoration: none
}
 
 .fwidth {
     width: 100%
 }
 
 .maxwidth {
     max-width: 300px
 }
 
 .mobile-video {
     display: none
 }
 
 @media (max-width:576px) {
     .mobile-video {
         display: block;
         margin-top: 30px
     }
 }
 
 .bannerimagesize {
     width: 1920px;
     height: 450px
 }
 
 .productimageize {
     width: 253px;
     height: 253px
 }
 
 .news-letter {
     background-color: #296de5;
     height: auto;
     padding: 40px;
     margin-top: 30px;
 }
 
 .news-letter h1 {
     font-size: 30px;
     font-weight: 600;
     color: white;
     margin-top: 34px;
 }
 
 .news-letter img {
     width: 60%;
     margin-top: 30px;
 }
 
 .news-letter p {
     color: white;
     font-size: 18px;
 }
 
 .news-letter input[type=submit] {
     background-color: #4CAF50;
     color: white;
     border: none;
 }
 
 .modal-bottle {
     display: none;
     position: fixed;
     z-index: 10;
     padding-top: 100px;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     overflow: auto;
     background-color: rgb(0, 0, 0);
     /* Fallback color */
     background-color: rgba(0, 0, 0, 0.4);
     /* Black w/ opacity */
 }
 /* Modal Content */
 
 .modal-content-bottle {
     background-color: #fefefe;
     margin: auto;
     padding: 5px;
     border: 1px solid #888;
     width: 86%;
 }
 /* The Close Button */
 
 .close8 {
     color: #aaaaaa;
     font-size: 28px;
     font-weight: bold;
     margin-top: -9px;
     right: 14px;
     position: absolute;
 }
 
 .close8:hover,
 .close8:focus {
     color: #000;
     text-decoration: none;
     cursor: pointer;
 }
 
 .enquiry-bottle {
     cursor: pointer;
     position: fixed;
     right: 0;
     margin-top: 150px;
     background-color: orange;
     color: white;
     padding: 9px;
     font-size: 18px;
     border-radius: 10px;
     transition: all 0.5s;
     border: 2px solid orange;
     writing-mode: vertical-rl;
     z-index: 601;
 }
 
 .enquiry-bottle:hover {
     border: 2px solid orange;
     color: orange;
     background-color: white;
 }
 
 .popup-button {
     border-radius: 4px;
     background-color: orange;
     border: none;
     color: #FFFFFF;
     text-align: center;
     font-size: 15px;
     padding: 6px;
     width: 98px;
     transition: all 0.5s;
     cursor: pointer;
     margin: 0px;
     border: 1px solid orange;
 }
 
 .popup-button:hover {
     border-radius: 4px;
     background-color: white;
     border: none;
     color: orange;
     text-align: center;
     font-size: 15px;
     padding: 6px;
     width: 98px;
     cursor: pointer;
     margin: 0px;
     border: 1px solid orange;
 }
 
 .popup-title h3 {
     margin-top: 30px;
 }

 .search-blog{
     border: 1px solid lightgray;
     margin-top: 20px;
     padding: 10px;
 }

 .search-blog input{
     width: 100%;
     padding: 5px;
     background-color: #d3d3d340;
     border: none;
 }

 .search-blog button{
    position: absolute;
    margin-top: 0px;
    right: 26px;
    padding: 2px;
    width: 34px;
    height: 34px;
    border: none;
    color: white;
    background: #296de5;
 }

 .mobile-view{
     display: none;
 }

 .mobile-view2{
     display: block;
 }

 @media (max-width:576px){
    .mobile-view{
        display: block;
    }
   
    .mobile-view2{
        display: none;
    }
 }