/*
====================================
large Screen - Others
====================================
*/
@media screen and (min-width: 1200px) and (max-width: 1399px) {

    .senarai-content-image {
        top: -25px;
    }

    .senarai-content-image img {
        max-width: 330px;
    }



}





@media screen and (min-width: 992px) and (max-width: 1199px) {

    /*=== resipi area start ===*/

    .resipi-content .container {
        max-width: 960px;
    }

    .resipi-title {
        margin-bottom: 120px;
    }

    .resipi-item-image {
        padding: 42px 20px;
    }

    .resipi-item-image div:nth-of-type(1) {
        left: 0;
        bottom: 50px;
        max-width: 170px;
    }

    .resipi-item-content ul {
        padding: 0 20px 24px;
    }

    .resipi-item-content ul li {
        font-size: 18px;
    }

    .senarai-content-image {
        top: 20px;
    }

    .senarai-content-image img {
        max-width: 230px;
    }

    /*=== celebration area start ===*/

    .celebration-area {
        margin-top: -370px;
    }






}

/*
====================================
Small Screen - Tablate
====================================
*/
@media screen and (min-width: 768px) and (max-width: 991px) {

    /*=== resipi area start ===*/

    .resipi-content .container {
        max-width: 720px;
    }

    .resipi-title {
        margin-bottom: 140px;
    }

    .resipi-item {
        grid-template-columns: repeat(2, 1fr);
    }

    .resipi-item-inner {
        margin-bottom: 120px;
    }

    .resipi-item-image {
        padding: 42px 20px;
    }

    .resipi-item-image div:nth-of-type(1) {
        bottom: 50px;
        max-width: 170px;
    }

    .resipi-item-content ul {
        padding: 0 20px 24px;
    }

    .resipi-item-content ul li {
        font-size: 18px;
    }

    .resipi-content-button a span {
        width: 360px !important;
    }

    .senarai-area {
        padding-top: 100px;
    }

    .senarai-content {
        padding-bottom: 100px;
    }

    .senarai-content-image {
        top: 80px;
    }

    .senarai-content-image img {
        max-width: 140px;
    }

    /*=== blog area start ===*/

    .blog-area {
        padding: 80px 0 650px;
        margin-top: -90px;
    }

    .blog-title {
        padding: 100px 0 30px;
    }

    .blog-title h2 {
        font-size: 42px;
    }

    .owl-carousel {
        padding: 0 30px;
    }

    .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev {
        width: 70px;
        height: 70px;
    }

    /*=== celebration area start ===*/

    .celebration-area {
        padding: 350px 0 650px;
        margin-top: -330px;
    }





}

/*
====================================
Small Screen - Mobile
====================================
*/
@media screen and (max-width: 767px) {

    /*=== Header area start ===*/
.row .drinks-frame img {
    width: 74%;
    transform: translateX(-22%);
    bottom:-50px;
}
    .header-area {
        padding: 30px 0 10px;
    }	
.row .mamak-guy img {
    width: 56%;
    right: 0;
    transform: translateX(20%);
    bottom:-70px;
}
    /*=== main content start ===*/

    .youtube-video-area {
        padding: 24px 0 150px;
    }

    .youtube-video-item iframe {
        height: 280px;
    }

    /*=== resipi area start ===*/

    .resipi-area {
        padding: 0px;
    }

    .resipi-content .container {
        max-width: 540px;
    }

    .resipi-title {
        margin-bottom: 140px;
    }

    .resipi-item {
        grid-template-columns: repeat(1, 1fr);
    }

    .resipi-item-inner {
        margin-bottom: 120px;
    }

    .resipi-item-inner-second {
        margin-bottom: 30px;
    }

    .resipi-item-image {
        padding: 42px 20px;
    }

    .resipi-item-image div:nth-of-type(1) {
        bottom: 50px;
        max-width: 170px;
    }

    .resipi-item-content ul {
        padding: 0 20px 24px;
    }

    .resipi-item-content ul li {
        font-size: 18px;
    }

    .resipi-content-button a span {
        width: 260px !important;
    }

    .senarai-area {
        padding-top: 70px;
    }

    .senarai-content {
        padding-bottom: 70px;
    }

    .senarai-button a {
        font-size: 24px;
        width: 260px;
        height: 50px;
    }

    .senarai-content-image {
        top: 60px;
    }

    .senarai-content-image img {
        max-width: 70px;
    }

    .kombo-area {
        padding-bottom: 100px;
    }

    /*=== company logo area start ===*/

    .company-logo-area {
        padding: 50px 0 30px;
    }

    .company-logo-item ul li {
        width: 33.3333%;
        padding: 0 15px 20px;
    }

    /*=== letupan area start ===*/
    section.letupan-area {
        padding: 35px 0 350px;
        background-image: url(../images/letupan-bg-mob1.jpg);
        background-position: center bottom !important;
        background-size: 113%;
    }
    .letupan-button a span {
        font-size: 16px;
        width: 320px;
        height: 70px;
    }

    .letupan-button a small {
        font-size: 16px;
        display: block;
        width: 225px;
        margin-top: -20px;
    }

    .letupan-button a img {
        width: 90px;
        top: -10px;
        left: -20px;
    }

    /*=== blog area start ===*/

    .blog-area {
        padding: 80px 0 200px;
        margin-top: -110px;
        background-position:-422px;
    }
.letupan.img {
    margin-top: 20px;
    margin-bottom: -20px;
}
    .letupan.mob img {
    transform: scale(1.3);
}
    .blog-title {
        padding: 80px 0 30px;
    }

    .blog-title h2 {
        font-size: 32px;
    }

    .owl-carousel {
        padding: 0 15px;
    }

    .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev {
        width: 50px;
        height: 50px;
    }

    /*=== celebration area start ===*/

    section.celebration-area {
        background-image: url(../images/celebration-bg-mob.png);
        padding: 43% 0px 0px 0px;
        margin-top: 0px;
        background-size: cover;
        background-position: center top !important;
        margin-top: -8%;
    }


}