/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/

/* xs: phone - portrait */
/* default. no media */

h4 {
    font-size: 3.5rem;
    margin-bottom: 0px;
}
h5 {
    font-size: 2.5rem;
    margin-bottom: 0px;
}
.title-ornaments {
    position: relative;
}
.title-ornaments::before {
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    width: 130px;
    height: 40px;
    background-image: url(../images/_v1_6/ornaments/rectangle-302.png);
    background-size: 100% 50%;
    background-repeat: no-repeat;
    background-position: top left;
    opacity: 0.1;
}
.title-ornaments::after {
    content: '';
    position: absolute;
    top: 2rem;
    right: 0px;
    width: 130px;
    height: 40px;
    background-image: url(../images/_v1_6/ornaments/rectangle-303.png);
    background-size: 100% 50%;
    background-repeat: no-repeat;
    background-position: right;
    opacity: 0.1;
}

.bg-barong {
    position: relative;
    background-image: url("../images/_v1_6/backgrounds/mplid-s12-bg.jpg");
    background-size: auto 100%;
    background-repeat: repeat;
    background-position: center;
}

.bg-barong-2 {
    background-image: url("../images/_v1_6/backgrounds/bg-barong.webp");
    background-size: auto 100%;
    background-repeat: repeat;
    background-position: center;
}
/* .bg-barong::before {
	content: '';

	position: absolute;
	top: 70px;
	left: 0px;

	width: 100%;
	height: 60px;
	background: linear-gradient(to top, rgba(0,0,0,0) 0%, rgba(255,255,255,1) 100%);
}
.bg-barong::after {
	content: '';

	position: absolute;
	bottom: 0;
	left: 0;

	width: 100%;
	height: 60px;
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(255,255,255,1) 100%);
} */

/* sm: phone - landscape */
@media (min-width: 576px) {
}

/* md: tablet */
@media (min-width: 768px) {
}

/* lg: desktop */
@media (min-width: 992px) {
    h4 {
        font-size: 5rem;
        line-height: 5rem;
        margin-bottom: 15px;
        padding-top: 20px;
    }
    h5 {
        font-size: 4rem;
        margin-bottom: 10px;
    }
	.bg-barong {
		background-size: 100% auto;
	}
    .title-ornaments::before {
        top: 20px;
        left: 0px;
        width: 500px;
        height: 80px
    }
    .title-ornaments::after {
        top: 20px;
        right: 0px;
        width: 500px;
        height: 80px;
    }
}

/* xl: wide */
@media (min-width: 1200px) {
}

/* super wide */
@media (min-width: 1440px) {
}