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

body:after{
    content: "dev version | screen: small";
}

/* Paragraph Card A (Image | Description) */
.paragraph--type--card-a{
    flex-direction: row;
}
.paragraph--type--card-a .field--name-field-card-a-img{
    width: 50%;
}
.paragraph--type--card-a .field--name-field-card-a-desc{
    width: 50%;
    align-self: center;
}
.paragraph--type--card-a .field--name-field-card-a-desc h2{
    font-size: 25px;
    font-weight: bold;
    font-family: 'Merriweather';
    margin-bottom: 20px;
}

/* Paragraph Tabs */
.paragraph--type--tabs .field--name-field-tab-body{
    column-count: 2;
}
.paragraph--type--tabs .tabs-button-container{
    background: #7d8b98;
    padding: 20px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin: 0 -12% 20px -12%;
}

/* Berita Semasa / Current News */
.view-berita-semasa ul li{
    width: 48%;
}

/* Speech */
.view-speech ul li{
    width: 48%;
}

/* Galeri Foto, Photo Gallery (listing) */
.view-galeri-foto.listing ul li{
    width: 48%;
}

/* Galeri Foto, Photo Gallery (individual) */
.view-galeri-foto.individual .album-container{
    flex-direction: row;
}
.view-galeri-foto.individual .album-container .photos{
    width: 50%;
}
.view-galeri-foto.individual .album-container .description{
    width: 50%;
    padding-left: 1.25rem;
}
.view-galeri-foto.individual .album-container h2{
    font-size: 1.125rem;
    margin-bottom: 1.25rem;
}

/* Infographics */
.view-infographics.listing ul li{
    width: 48%;
}

/* main wrapper */
#main-wrapper{
    padding: 75px 5% 50px 5%;
}

/* Branding */
.branding{
    width: 100%;
    display: flex;
    flex-direction: row;
    /* align-items: flex-end; */
    /* height: 170px; */
    /* padding-bottom: 30px; */
}

/* Header first */
.header-first-container{
    /* position: absolute;
    top: 0; */
    /* background: none; */
}
    /* body.path-frontpage .header-first-container{
        height: 241px;
    } */

/* Main Menu block */
.main-menu-block {
    background: rgba(255,255,255,0.90);
    width: 80%;
    margin: 5% auto 0 auto;
    border-radius: 1.25rem;
    padding: 2% 50px 2% 0 ;
    /* padding: 0.625rem 0; */
    position: fixed;
    top: 10%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1000;
    display: none;
}
.main-menu-block.is-active{
    display: block;
}

/* .main-menu-block{
    padding: 2% 50px 2% 0 ;
} */
.main-menu-block ul li{
    width: auto;
}

/* inner page */
.header-first-container .header-first-a{
    /* order: 1; */
    justify-content: flex-start;
    padding-left: 5%;
    width: auto;
}
.header-first-container .header-first-b{
    /* order: 2; */
}
.header-first-container .header-first-c{
    /* order: 3; */
    padding-right: 5%;
}

body:not(.path-frontpage) .header-first-container{
    position: relative;
    top: 0 !important;
    padding-top: 0;
    background: url("../images/inner-page-header-bg.jpg") no-repeat;
    z-index: 20;
}
body:not(.path-frontpage) .header-first-container .header-first-a{
    /* width: 25%; */
    /* height: 120px; */
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    text-align: left;
    padding-left: 5%;
}
body:not(.path-frontpage) .header-first-container .header-first-b{
    /* width: 50%; */
    /* height: 120px; */
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
body:not(.path-frontpage) .header-first-container .header-first-c{
    /* width: 25%; */
    /* height: 120px; */
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

/* Inner page banner */
.inner-page-banner-container{
    /* margin-top: -50px; */
    /* top: 75px; */
    display: block;
}

/* Page banner (views) */
.page-banner-block{
    position: absolute;
    z-index: 150;
    width: 100%;
    height: 100%;
    margin: 0px auto 0 auto;
    text-align: center;
}
.inner-page-banner-container .views-field-field-page-banner img{
    object-fit: cover;
    width: 90%;
    height: 300px;
    border-radius: 10px;
}

/* Page banner default block */
.page-banner-default-block .field--name-field-banner-image img{
    height: 300px;
}
.page-banner-default-block img{
    object-fit: cover;
    width: 90%;
    height: 200px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
    border-radius: 10px;
}

/* Page banner custom block */
.page-banner-custom-block .field--name-field-banner-image img{
    height: 300px;
}
.page-banner-custom-block img{
    object-fit: cover;
    width: 90%;
    height: 200px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
    border-radius: 10px;
}
/* Hamburger menu */
.hamburger-menu-block{
    background: none;
    width: auto;
    top: 1%;
    left: 5%;
    position: fixed;
    box-shadow: none;
}
/* .hamburger-menu-block.is-active{
    left: 45%;
} */
.hamburger-menu-block .hamburger{
    flex-direction: column;
}
.hamburger-menu-block .hamburger-box{
    margin: 0 auto;
    width: 3.75rem;
    height: auto;
    background: #FFFFFF;
    box-shadow: 0 0 50px rgba(0, 0, 0, 0.5);
}
.hamburger-menu-block .hamburger-label{
    top: 0.875rem;
    left: 0;
    text-shadow: 0 0.0625rem 0.1875rem rgba(0,0,0,0.5);
    color: #FFFFFF !important;
}
.hamburger.is-active .hamburger-label{
    color: #FFFFFF !important;
}
.hamburger.is-active .hamburger-box{
    border: 1px solid #000000;
}


/* Page title reposition in banner area */
#block-cmhajiji-2023-page-title{
    display: flex;
    height: 300px;
    flex-direction: column;
    justify-content: center;
    margin-top: 0;
    top: 0;
    z-index: 200;
    padding: 0 10%;
}

/* Mobile menu */
.mobile-menu-container{
    width: auto;
    height: auto;
    background: none;
}

body:not(.path-frontpage) .mobile-menu-container{
    /* top: 80px; */
}

/* body.path-frontpage .mobile-menu-container{
    top: 80px;

} */

/* Social media block */
.social-media-block ul{
    justify-content: flex-end;
}

/* Latest Post 02 block */
.view-latest-posts-2.no-slick .view-content ul li{
    width: 48%;
}

.popup-banner-container .popup-banner img{
    width: 90%;
    height: auto;
    object-fit: contain;
}

/* Video */
.view-video ul li{
    width: 48%;
}

/* Video (Berita ringkas) */
.view-video-berita-ringkas  ul li{
    width: 48%;
}

/* Aku Janji block */
.view-aku-janji .view-content{
    width: 50%;
}

/* Aku Janji attachment (cover images) */
.view-aku-janji .attachment{
    width: 50%;
    height: 430px;
}

/* Aku Janji page */
.view-aku-janji-page .view-content ul li{
    width: 48%;
}

/* Footer first */
.site-footer .footer-first-container{
    flex-direction: row;
    padding: 5%;
}

/* Address (footer) */
/* .site-footer .address-footer-block{
    width: 60%;
    padding: 2% 5%;
} */

/* Social media (footer) */
.site-footer .social-media-footer-block{
    width: 40%;
    border-left: 1px solid #02588b;
    padding: 2% 5%;
}

/* Popup banner (listing) */
.view-popup-banner.listing ul li{
    width: 48%;
}

/* Siaran Media */
.view-siaran-media.individual > .view-content{
    width: 80%;
    padding-right: 4%;
}
.view-siaran-media.individual .attachment{
    width: 20%;
    display: block;
}

/* News grid */
.view-news-grid.listing ul li{
    width: 48%;
}
.view-news-grid.listing ul li .views-field-field-newsgrid-cover img{
    /* height: 15.625rem; */
}

/* Mantra */
.mantra-block{
    position: absolute;
    top: 58%;
    left: 10%;
    width: 50%;
    transform: unset;
    display: block;
}
.mantra-mobile-block{
    display: none;
}
.mantra-block{
    left: 8.5%;
}
.mantra-box h2{
    font-weight: 600;
    /* font-size: 15px; */
    /* padding: 3px 35px 3px 35px; */
    text-shadow: 0px 1px 3px rgba(0,0,0,0.5);
}

/* Branding */
.branding-logo-block img{
    height: 4.375rem;
}

/* Latest Post block */
.view-latest-posts .view-header h2{
    font-size: 1.875rem;
    text-shadow: 0 2px 5px rgba(0,0,0,0.5);
}

/* Frontpage first background */
.frontpage-first-container .background-img{
    display: block;
}
.frontpage-first-container .content-wrapper{
    z-index: 10;
    position: absolute;
    top: 0;
    left: 0;
    background: none;
    padding: 0;
}

/* Frontpage second background */
.frontpage-second-container .background-img{
    display: block;
}
.frontpage-second-container .content-wrapper{
    z-index: 10;
    position: absolute;
    top: 0;
    left: 0;
    background: none;
    padding: 0;
}

/* Highlights */
.view-highlights .view-content .views-row{
    width: 25%;
    margin: 0;
}
.highlights-block h2.block-title{
    font-size: 1.875rem;
    text-shadow: 0 2px 5px rgba(0,0,0,0.5);
}

/* Footer first */
.footer-first-container .background-img{
    display: block;
}
.footer-first-container .content-wrapper{
    flex-direction: row;
    z-index: 20;
    position: absolute;
    top: 0;
    left: 0;
}

/* Hubungi Kami */
.site-footer .hubungi-kami-header-block{
    width: 40%;
    flex-basis: unset;
    /* display: flex;
    align-content: flex-end; */
}
/* Address footer block */
.site-footer .address-footer-block{
    width: 60%;
}

/* Hubungi Kami */
.site-footer .hubungi-kami-header-block h2{
    font-size: 3.125rem;
    /* font-weight: 500; */
    line-height: 1;
    text-align: left;
}
.site-footer .address-footer-block h2{
    text-align: left;
}
.site-footer .address-footer-block .address-container{
    text-align: left;
}
.site-footer .social-media-container h2{
    text-align: center;
}

/* main wrapper shift a bit to the left */
body.page-view-galeri-foto #main-wrapper,
body.page-view-news-grid #main-wrapper,
body.page-view-berita-semasa #main-wrapper,
body.page-view-news-cutting #main-wrapper,
body.page-view-infographic-02 #main-wrapper,
body.page-view-siaran-media #main-wrapper,
body.page-view-popup-banner #main-wrapper,
body.page-view-video #main-wrapper,
body.page-view-video-berita-ringkas #main-wrapper{
    padding-left: 15%;
}

/* Teras SMJ page */
.page-node-6643 .sabah-teras-smj-container{
    margin-top: -9.375rem;
}

/* News cutting */
.view-news-cutting.listing .news-container{
    flex-wrap: nowrap;
}

/* Infographics (listing) */
.view-infographics.listing ul{
    justify-content: space-between;
}

/* Popup banner (listing) */
.view-popup-banner.listing ul{
    justify-content: flex-start;
}

/* Video */
.view-video ul{
    justify-content: flex-start;
}

/* Video (Berita Ringkas) */
.view-video-berita-ringkas ul li .video-container{
    /* flex-wrap: nowrap;
    justify-content: flex-start;
    text-align: left; */
}

/* SABAH - large text */
.sabah-large-text-block{
    top: 0;
}

.view-latest-posts .view-header h2{
    margin: 2.5rem 0;
}
.highlights-block h2.block-title{
    margin: 2.5rem 0;
}

/* inner page */
body:not(.path-frontpage) .header-first-container{
    padding-top: 10%;
}

/*************************************************************/
}