#about-section {
    position: relative;
    z-index: 3;
    top: 30px;
    padding: 100px 0px;
    background: #f0f0f0;
}

#about-section .header-section {
    position: relative;
    display: inline-block;

}

#about-section .header-section::before {
    width: 40px;
    height: 40px;
    position: absolute;
    left: 0px;
    text-align: center;
    top: -20px;
    background: #f59b11;
    content: '';
    z-index: -1;
}

#about-section h2 {
    font-size: 48px;
}

#about-section .col-img {
    position: relative;
}

#about-section .col-img::before {
    position: absolute;
    content: '';
    width: 170px;
    height: 170px;
    bottom: 15px;
    left: -30px;
    background: #f59a118c;
}

#service-section {
    position: relative;
    z-index: 3;
    top: -80px;
    padding: 40px 0px;
    background: #f0f0f0;
}

#service-section .header-section {
    position: relative;
    display: inline-block;
}

#service-section .header-section::before {
    width: 40px;
    height: 40px;
    position: absolute;
    left: -15px;
    top: -20px;
    background: #f59b11;
    content: '';
    z-index: -1;
}

#service-section h2 {
    font-size: 48px;
}

#service-section .col-ser {
    position: relative;
}

#service-section .col-ser .ser-item {
    position: relative;
    overflow: hidden;
}

#service-section .col-ser .ser-item .ser-img {
    position: relative;
    overflow: hidden;
    height: 400px;
}

#service-section .col-ser .ser-item .ser-img img {
    position: relative;
    overflow: hidden;
    object-fit: cover;
}

#service-section .col-ser .ser-item .ser-img img {
    border-radius: 90px 0 0 0;
    position: relative;
}


#service-section .col-ser .ser-item .ser-img::before {
    position: absolute;
    content: '';
    background: #f59b11;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    border-radius: 90px 0 0 0;
    opacity: 0.7;
    -webkit-transition: all .5s ease-in-out;
    -khtml-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    transform: translateY(0px);
}

#service-section .col-ser .ser-item:hover .ser-img::before {
    opacity: 1;
    -webkit-transition: all .5s ease-in-out;
    -khtml-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    transform: translateY(0px);
}

#service-section .col-ser .ser-item .ser-text {
    position: relative;
    opacity: 1;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    padding: 30px 30px;
    width: 100%;
    height: 100%;
    display: block;
}

#service-section .col-ser .ser-item .ser-text {
    position: absolute;
    top: 30px;
    z-index: 99;
    opacity: 1;
    -webkit-transition: all .5s ease-in-out;
    -khtml-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    transform: translateY(0);
}

#service-section .col-ser .ser-item:hover .ser-text {
    opacity: 1;
    -webkit-transition: all .5s ease-in-out;
    -khtml-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    transform: translateY(0px);
}

#product-section {
    position: relative;
    z-index: 3;
    top: -55px;
    padding: 70px 0px;
}


#product-section h2 {
    font-size: 48px;
}

#product-section .header-section {
    position: relative;
    display: block;
}

#product-section .header-section::before {
    width: 40px;
    height: 40px;
    position: absolute;
    left: 0px;
    top: -20px;
    background: #f59b11;
    content: '';
    z-index: -1;
}

.pro-item {
    position: relative;
}

.pro-item .pro-img {
    position: relative;
    overflow: hidden;
    height: 280px;
}

.pro-item .pro-img {
    position: relative;
    overflow: hidden;
    object-fit: cover;
}

.pro-item .pro-img img {
    transform: scale(1);
    -webkit-transition: all .5s ease-in-out;
    -khtml-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}

.pro-item:hover .pro-img img {
    transform: scale(1.2);
    -webkit-transition: all .5s ease-in-out;
    -khtml-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}

.pro-item .pro-text {
    display: block;
    box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
    padding: 5px;
    border: 0.5px solid #f0f0f0;
    background: #fff;
}

.pro-item .pro-text span {
    font-size: 48px;
    font-weight: 800;
    color: #fff;
    text-align: center;
    background: #f59b11;
    position: relative;
    bottom: -7px;
    margin-left: 5px;
}




#contact-section .header-section {
    position: relative;
    display: inline-block;
}

#contact-section .header-section::before {
    width: 40px;
    height: 40px;
    position: absolute;
    left: -15px;
    top: -20px;
    background: #f59b11;
    content: '';
    z-index: -1;
}

#contact-section h2 {
    font-size: 48px;
}

#contact-section .form-con {
    background-color: #f59b11;
    border-radius: 50px 0 0 0;
}

#contact-section .button-slide a {
    background: #fff;
    width: 140px;
    color: #242424;
    border-radius: 0 25px 0 0;
    -webkit-transition: all .5s ease-in-out;
    -khtml-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}

#contact-section .button-slide a:hover {
    width: 200px;
    -webkit-transition: all .5s ease-in-out;
    -khtml-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}

#event-section {
    position: relative;
    z-index: 3;
    top: 0px;
    padding: 30px 0px;
}

#event-section h2 {
    font-size: 48px;
    position: relative;
}

#event-section .container-xxl {
    background: #f0f0f0;
    padding: 20px 30px;
    border-radius: 0 150px 0 0;
    z-index: 0;
    display: block;
}

#event-section .header-section {
    position: relative;
    display: inline-block;
}

#event-section .header-section::before {
    width: 40px;
    height: 40px;
    position: absolute;
    left: -15px;
    top: -20px;
    background: #f59b11;
    content: '';
    display: block;
    z-index: 0;
}

#event-section .item-event {
    margin-bottom: 20px;
    display: block;
    position: relative;
}

#event-section .item-event .img-event {
    overflow: hidden;
    margin-bottom: 15px;
}

#event-section .item-event .img-event img {
    transform: scale(1);
    -webkit-transition: all 0.5s ease-in-out;
    -khtml-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

#event-section .item-event .img-event img {
    transform: scale(1);
    -webkit-transition: all 0.5s ease-in-out;
    -khtml-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

#event-section .item-event .text-event h4 {
    color: #242424;
    font-weight: 600;
    font-size: 20px;
    line-height: 34px;
    margin-bottom: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 2;
}

#event-section .item-event .text-event .detail {
    color: #242424;
    height: 75px;
    margin-bottom: 10px;
    overflow: hidden;
}

#event-section .item-event .text-event .read-detail {
    display: inline-block;
    padding: 10px 15px;
    margin-bottom: 10px;
    background: #bc0013;
    color: #ffffff;
    -webkit-transition: all 0.3s ease-in-out;
    -khtml-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

#event-section .item-event:hover .text-event .read-detail {
    background: #000000;
    -webkit-transition: all 0.3s ease-in-out;
    -khtml-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.row-conf {
    position: relative;
}

.row-conf::before {
    position: absolute;
    left: 47%;
    content: '';
    background: #f59b11;
    width: 100px;
    display: none;
    height: 5px;
}

.contact-foot ul {
    list-style: none;
    padding-inline-start: 50px;
}

.contact-foot ul li {
    position: relative;
    font-weight: 500;
}

.contact-foot ul li:before {
    font-family: 'Material Icons Sharp';
    position: absolute;
    text-align: center;
    color: dark;
    content: "\e55f";
    width: 35px;
    height: 35px;
    border-radius: 100%;
    left: -70px;
    top: 17px;
    /* margin-right: 15px; */
    /* margin-bottom: 50px; */
    vertical-align: middle;
    font-size: 62px;
    padding: 10px;
    /* padding-right: 1px; */
}


.contact-foot2 ul {
    list-style: none;
    padding-inline-start: 50px;
}

.contact-foot2 ul li {
    position: relative;
    font-weight: 500;
}

.contact-foot2 ul li:before {
    font-family: 'Material Icons Sharp';
    position: absolute;
    text-align: center;
    color: dark;
    content: "\e0b0";
    width: 35px;
    height: 35px;
    border-radius: 100%;
    left: -60px;
    top: 17px;
    /* margin-right: 15px; */
    /* margin-bottom: 50px; */
    vertical-align: middle;
    font-size: 62px;
    padding: 10px;
    /* padding-right: 1px; */
}

@media (min-width: 992px) {

    .contact-foot2 ul li:before {
        font-family: 'Material Icons Sharp';
        position: absolute;
        text-align: center;
        color: dark;
        content: "\e0b0";
        width: 35px;
        height: 35px;
        border-radius: 100%;
        left: -70px;
        top: 17px;
        /* margin-right: 15px; */
        /* margin-bottom: 50px; */
        vertical-align: middle;
        font-size: 62px;
        padding: 10px;
        /* padding-right: 1px; */
    }

    .contact-foot ul {
        list-style: none;
        padding-inline-start: 50px;
    }

    .contact-foot2 ul {
        list-style: none;
        padding-inline-start: 85px;
    }


    .row-conf {
        position: relative;
    }

    .row-conf::before {
        position: absolute;
        display: inline-block;
        left: 47%;
        content: '';
        background: #f59b11;
        width: 100px;
        height: 5px;
    }

    #service-section .col-ser .ser-item .ser-img::before {
        position: absolute;
        content: '';
        background: #f59b11;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        z-index: 1;
        border-radius: 90px 0 0 0;
        opacity: 0;
        -webkit-transition: all .5s ease-in-out;
        -khtml-transition: all .5s ease-in-out;
        -moz-transition: all .5s ease-in-out;
        -ms-transition: all .5s ease-in-out;
        -o-transition: all .5s ease-in-out;
        transition: all .5s ease-in-out;
        transform: translateY(300px);
    }

    #service-section .col-ser .ser-item:hover .ser-img::before {
        opacity: 1;
        -webkit-transition: all .5s ease-in-out;
        -khtml-transition: all .5s ease-in-out;
        -moz-transition: all .5s ease-in-out;
        -ms-transition: all .5s ease-in-out;
        -o-transition: all .5s ease-in-out;
        transition: all .5s ease-in-out;
        transform: translateY(0px);
    }

    #service-section .col-ser .ser-item .ser-text {
        position: absolute;
        top: 30px;
        z-index: 99;
        opacity: 0;
        -webkit-transition: all .5s ease-in-out;
        -khtml-transition: all .5s ease-in-out;
        -moz-transition: all .5s ease-in-out;
        -ms-transition: all .5s ease-in-out;
        -o-transition: all .5s ease-in-out;
        transition: all .5s ease-in-out;
        transform: translateY(300px);
    }

    #service-section .col-ser .ser-item:hover .ser-text {
        opacity: 1;
        -webkit-transition: all .5s ease-in-out;
        -khtml-transition: all .5s ease-in-out;
        -moz-transition: all .5s ease-in-out;
        -ms-transition: all .5s ease-in-out;
        -o-transition: all .5s ease-in-out;
        transition: all .5s ease-in-out;
        transform: translateY(0px);
    }

    #about-section {
        position: relative;
        z-index: 3;
        top: -80px;
        padding: 120px 0px;
        background: #f0f0f0;
    }

    #product-section .header-section {
        position: relative;
        display: block;
    }

    #product-section .header-section::before {
        width: 40px;
        height: 40px;
        position: absolute;
        left: -15px;
        top: -20px;
        background: #f59b11;
        content: '';
        z-index: -1;
    }

    #about-section .header-section {
        position: relative;
        display: inline-block;
    }

    #about-section .header-section::before {
        width: 40px;
        height: 40px;
        position: absolute;
        left: -15px;
        text-align: center;
        top: -20px;
        background: #f59b11;
        content: '';
        z-index: -1;
    }

    #event-section .row-event {
        display: inherit;
    }

    #event-section .container-xxl {
        background: #f0f0f0;
        padding: 20px 50px;
        border-radius: 0 150px 0 0;
        z-index: 0;
        display: block;
    }

    #event-section .row-event .col-md-6:nth-child(1) {
        float: left;
    }

    #event-section .row-event .col-md-6 {
        float: left;
    }

    #event-section .img-event {
        width: 40%;
        display: inline-block;
        float: left;
    }

    #event-section .img-event img {
        width: 100%;
        height: 225px;
        -o-object-fit: cover;
        object-fit: cover;
    }

    #event-section .row-event .col-md-6:nth-child(1) .img-event img {
        width: 100%;
        /*height: 450px;*/
        -o-object-fit: cover;
        object-fit: cover;
    }

    #event-section .text-event {
        width: 60%;
        padding-left: 15px;
        display: inline-block;
    }

    #event-section .text-event .detail {
        display: block;
    }

    #event-section .row-event .col-md-6:nth-child(1) .img-event {
        width: 100%;
        display: block;
        float: none;
    }

    #event-section .row-event .col-md-6:nth-child(1) .text-event {
        width: 100%;
        padding-left: 0px;
        display: block;
        margin-top: 40px;
    }

    #event-section .row-event .col-md-6:nth-child(1) .text-event .detail {
        display: block;
    }

    
}