*{
            margin: 0;
            padding: 0;
        }
        body{
            padding: 20px 10%;
        }
        .image-container{
            margin-top: 90px;
            margin-bottom: 20px;
        }
        .image-top{
            width: 100%;
            height: 300px;
            background: #2c395f;
            border-radius: 11px;
            position: relative;
        }
        .image-top img{
            width: 100%;
            height: 100%;
            border-radius: 10px;
        }
        .text-top{
            width: 100%;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            text-align: center;
            color: #fff;
        }
        .text-top p{
            font-size: 1.2rem;
            font-weight: bold;
            margin: 10px;
        }
        .text-top h1{
            font-size: 2.7rem;
            font-weight: bold;
            margin: 10px;
        }
        .count-container{
            /*padding: 20px 10%;*/
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
            grid-gap: 20px;
        }
        .donate-blood{
            height: 130px;            
            border-radius: 5px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            box-shadow: rgba(0, 0, 0, 0.15) 0px 15px 25px, rgba(0, 0, 0, 0.05) 0px 5px 10px;
        }
        .donate-blood span{
            font-size: 1.8rem;
            margin: 10px;
        }
        .donate-blood h3 p{
            font-size: 1.1rem;
            margin: 5px;
        }
        
        /* Slider Style Start Heare  */

        .swiper {
            width: 100%;
            height: 175px;
            border-radius: 10px;
            margin-top: 20px;
            margin-bottom: 20px;
            /*padding: 20px 10%;*/
          }
    
          .swiper-slide {
            text-align: center;
            font-size: 18px;
            background: #615e5e;
            display: flex;
            justify-content: center;
            align-items: center;
          }
    
          .swiper-slide img {
            display: block;
            width: 100%;
            height: 100%;
          }

          .swiper-slide p{
            position: absolute;
            color: #fff;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            z-index: 999;
          }


        /* Slider Style End Heare  */
        
        
        .blog-container{
            /*padding: 20px 10%;*/
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
            grid-gap: 10px;
        }
        .blog-item{
            width: 100%;
            height: auto;
            box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;
            border-radius: 10px;
        }
        .blog-item img{
            width: 100%;
            height: 200px;
            border-top-left-radius: 10px;
            border-top-right-radius: 10px;
        }
        .blog-item h4{
            color: #2b9b5b;
            margin: 10px;
            font-size: 1rem;
        }
        .blog-item p{
            color: #000;
            margin: 10px;
            font-size: 1rem;
            letter-spacing: 1px;
            line-height: 20px;
        }
        .see-all{
            width: 80px;
            height: 30px;
            border-radius: 5px;
            background: #0ddf68;
            margin: 10px;
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .see-all a{
            text-decoration: none;
            color: #fff;
            font-size: 1.1rem;
        }

        .our-tame-container{
            /*padding: 20px 10%;*/
            display: flex;
            flex-wrap: wrap;
        }
        .our-tame-item{
            flex-basis: 200px;
            height: 200px;
            box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
            border-radius: 5px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            flex-grow: 1;
            margin: 10px;
        }
        .our-tame-item img{
            width: 100px;
            height: 100px;
            border-radius: 50%;
            border: 3px solid #1e8f3a;
        }
        .our-tame-item h4{
            margin-top: 10px;
            margin-bottom: 5px;
        }
        .imageslider{
            /*padding:10px 10%;*/
        }

        /* Responsive scrine 1080 px  */
        @media (max-width: 1080px){
            body{
                padding: 0;
            }
            .image-container{
                padding: 0;
                margin-left: 10px;
                margin-right: 10px;
            }
            .count-container{
                padding: 0;
                margin: 10px;            
            }
            .blog-container{
                padding: 0;
                margin: 10px;
            }
            .our-tame-container{
                margin: 10px;
            }
        }

        /* Responsive scrine 768 px  */
        @media (max-width: 768px){
            bady{
                padding: 0;
            }
            .donate-blood span{
                font-size: 1.1rem;
                margin: 3px;
            }
            .donate-blood h3 p{
                font-size: 1rem;
                margin: 4px;
            }
            .count-container{               
                grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
                grid-gap: 15px;
            }
            .donate-blood{
                height: 70px;
            }
            .donate-blood h3{
                font-size: 0.9rem;
            }
            .donate-blood p{
                font-size: 0.8rem;
            }
        }
         /* Responsive scrine 576 px  */
        @media (max-width: 576px){
            body{
                padding: 0;
            }
            .donate-blood span{
                font-size: 1.1rem;
                margin: 3px;
            }
            .donate-blood h3 p{
                font-size: 1rem;
                margin: 4px;
            }
            .blog-container{
                grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            }
            .blog-item img {
                height: 200px;
                
            }
            .donate-blood h3{
                font-size: 0.9rem;
            }
            .donate-blood p{
                font-size: 0.8rem;
            }

            .our-tame-item{
                flex-basis: 120px;
                height: 200px;
                margin: 6px;
            }
            .image-top {
                height: 200px;
                border-radius: 5px;
            }
            .image-top img{
                border-radius: 5px;
            }
        }