﻿


/* -----------------------------  MAIN PRODUCT CSS ------------------------------- */



#MainProduct {

    height:auto;    

}


    #MainProduct .Limon {
        background: url('../images/mainpage/mainproduct/linon.jpg') no-repeat center;
        background-size: cover;
        width: 100%;
        height:600px;
        
    }

        #MainProduct .Limon .Limon-Content {
            padding: 13%;
        }



    #MainProduct .Stawberry {
        background: url('../images/mainpage/mainproduct/stawberry.jpg') no-repeat center;
        background-size: cover;
        width: 100%;
        height: 600px;
    }

        #MainProduct .Stawberry .Stawberry-Content {
            padding: 13%;
        }

    #MainProduct .Pepper {
        background: url('../images/mainpage/mainproduct/tomato.jpg') no-repeat center;
        background-size: cover;
        width: 100%;
        height: 600px;
    }

        #MainProduct .Pepper .Pepper-Content {
            padding: 13%;
        }



@media screen and (max-width:1690px) {
    #MainProduct .Limon {
        height: 500px;
    }


    #MainProduct .Stawberry {
        height: 500px;
    }

    #MainProduct .Pepper {
        height: 500px;
    }


}

@media screen and (max-width:1450px) {
    #MainProduct .Limon {
        height: 450px !important;
    }
        #MainProduct .Limon .text-center span {
            font-size: 0.9em !important;
        }

        #MainProduct .Limon .text-center h1 {
            font-size: 3.5em !important;
        }

        #MainProduct .Limon .text-center a {
            font-size: 0.9em !important;
        }

        #MainProduct .Limon .Limon-Content {
            padding: 10% !important;
        }

    #MainProduct .Stawberry {
        height: 450px !important;
    }

        #MainProduct .Stawberry .text-center span {
            font-size: 0.9em !important;
        }

        #MainProduct .Stawberry .text-center h1 {
            font-size: 3.5em !important;
        }

        #MainProduct .Stawberry .text-center a {
            font-size: 0.9em !important;
        }

        #MainProduct .Stawberry .Stawberry-Content {
            padding: 10% !important;
        }

    #MainProduct .Pepper {
        height: 450px !important;
    }

        #MainProduct .Pepper .text-center span {
            font-size: 0.9em !important;
        }

        #MainProduct .Pepper .text-center h1 {
            font-size: 3.5em !important;
        }

        #MainProduct .Pepper .text-center a {
            font-size: 0.9em !important;
        }

        #MainProduct .Pepper .Pepper-Content {
            padding: 10% !important;
        }
}

@media screen and (max-width:1370px) {
    #MainProduct .Limon {
        height: 400px !important;
    }

      


    #MainProduct .Stawberry {
        height: 400px !important;
    }

      

    #MainProduct .Pepper {
        height: 400px !important;
    }

       
}

@media screen and (max-width:1290px) {
    #MainProduct .Limon {
        height: 370px !important;
    }


    #MainProduct .Stawberry {
        height: 370px !important;
    }



    #MainProduct .Pepper {
        height: 370px !important;
    }
}


@media screen and (max-width:680px) {
    #MainProduct .Limon {
        height: 350px !important;
    }

        #MainProduct .Limon .text-center span {
            font-size: 0.9em !important;
        }

        #MainProduct .Limon .text-center h1 {
            font-size: 3.3em !important;
        }

        #MainProduct .Limon .text-center a {
            font-size: 0.9em !important;
        }

        #MainProduct .Limon .Limon-Content {
            padding: 10% !important;
        }

    #MainProduct .Limon .Limon-Text {
        margin-top:-60% !important;
    }

    /*-------------------*/
    #MainProduct .Stawberry {
        height: 350px !important;
    }

        #MainProduct .Stawberry .text-center span {
            font-size: 0.9em !important;
        }

        #MainProduct .Stawberry .text-center h1 {
            font-size: 3.3em !important;
        }

        #MainProduct .Stawberry .text-center a {
            font-size: 0.9em !important;
        }

        #MainProduct .Stawberry .Stawberry-Content {
            padding: 10% !important;
        }

        #MainProduct .Stawberry .Stawberry-Text {
            margin-top: -60% !important;
        }

    /*-------------------*/

    #MainProduct .Pepper {
        height: 350px !important;
    }

        #MainProduct .Pepper .text-center span {
            font-size: 0.9em !important;
        }

        #MainProduct .Pepper .text-center h1 {
            font-size: 3.3em !important;
        }

        #MainProduct .Pepper .text-center a {
            font-size: 0.9em !important;
        }

        #MainProduct .Pepper .Pepper-Content {
            padding: 10% !important;
        }

        #MainProduct .Pepper .Pepper-Text {
            margin-top: -60% !important;
        }
}


/*   -------------  Svg Effect ---------------*/




