﻿ html {
	-webkit-font-smoothing: antialiased;
}

.div1 {
    /* The image used */
    height: 100%; /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    overflow-x: hidden;
    font-family: 'Nanum Gothic', sans-serif;
    background-color:#fff;
}

.sec1 {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5px 40px;
}

    .sec1 img {
        width: auto;
       
         image-rendering: -moz-crisp-edges;         /* Firefox */
image-rendering:   -o-crisp-edges;         /* Opera */
image-rendering: -webkit-optimize-contrast;/* Webkit (non-standard naming) */
image-rendering: crisp-edges;
-ms-interpolation-mode: nearest-neighbor;  /* IE (non-standard property) */
object-fit: cover;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
backface-visibility: hidden;
    }

.blkpatti {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgb(28,54,3);
    background: linear-gradient(90deg, rgba(28,54,3,1) 0%, rgba(54,90,16,1) 35%, rgba(83,134,33,1) 100%);
    height: 50px;
    color: white;
    font-size: 1rem;
    margin-bottom: 10px;
    text-align:center;
    font-weight:100;
    font-family: 'Roboto', sans-serif;
    font-weight:300;

     -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-transform: translate3d(0,0,0) !important;
transform: translate3d(0,0,0) !important;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
backface-visibility: hidden;

    
}


.sec2 {
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    flex-wrap: wrap;
}


    .sec2 a {
        width: 30%;
        text-align:center;
        margin-bottom:22px;
    }

    
    .sec2 a:hover {
       list-style:none;
       text-decoration:none;
    }



        .sec2 a img {
             width:100%;
            height:100%;
             image-rendering: -moz-crisp-edges;         /* Firefox */
image-rendering:   -o-crisp-edges;         /* Opera */
image-rendering: -webkit-optimize-contrast;/* Webkit (non-standard naming) */
image-rendering: crisp-edges;
-ms-interpolation-mode: nearest-neighbor;  /* IE (non-standard property) */
object-fit: cover;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
backface-visibility: hidden;
        }


    .content {
    display:block;
    background: rgb(28,54,3);
    background: linear-gradient(90deg, rgba(28,54,3,1) 0%, rgba(54,90,16,1) 35%, rgba(83,134,33,1) 100%);
    color:white;
    padding:10px;
    text-align:center;
     font-size: 0.9rem;
     font-weight:500;
     height:70px;
     display:flex;
     align-items:center;
      justify-content: center;  

    }

.knowmore {
background-color:#ffd800;
color:black;
padding:4px 10px;
font-size:14px; font-weight:800;
border-bottom-left-radius:10px;
border-bottom-right-radius:10px;
}


.sec3 {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    background-color:#262626;
    padding: 0px 5px;
    color:white;
    
   
}

.sec3left {
    display: flex;
    align-items: center;
}

    .sec3left ul {
        display: flex;
        align-items: center;
        margin-left: 5px;
        margin-top: 10px;
    }

        .sec3left ul li {
            list-style: none;
            align-items: center;
        }

         .sec3left ul li img{
            margin-right:8px;
             image-rendering: -moz-crisp-edges;         /* Firefox */
image-rendering:   -o-crisp-edges;         /* Opera */
image-rendering: -webkit-optimize-contrast;/* Webkit (non-standard naming) */
image-rendering: crisp-edges;
-ms-interpolation-mode: nearest-neighbor;  /* IE (non-standard property) */
object-fit: cover;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
backface-visibility: hidden;

        }




@media screen and (max-width: 992px) {

    .div1 {
        background-color: #fff;

    }

    .sec1 {
        width: 100%;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        margin-bottom: 10px;
    }

        .sec1 img {
            width: 100%;
        }

    .blkpatti {
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #262626;
        height: auto;
        color: white;
        font-size: 1rem;
        padding: 10px;
        margin-bottom: 50px;
    }

    .sec2 {
        width: 100%;
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        flex-wrap: wrap;
        padding: 10px;
        
    }

        .sec2 a {
            width: 100%;
            margin-bottom: 20px;
        }

            .sec2 a img {
                width: 100%;
              
            }


    .sec3 {
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        padding: 0px 0px;
        border:0;
         padding:10px;
    }

    .sec3left {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        justify-content: center;
        width:100%;
       
    }

        .sec3left ul {
            display: flex;
            align-items: center;
            justify-content: center;
            margin-left: -10px;
            margin-top: 10px;
        }

            .sec3left ul li {
                list-style: none;
                align-items: center;
            }

        .sec3left span {
            display: block;
            text-align: center;
            font-size: 17px;
            font-weight: 800;
        }
}
