/* css that every fornt end should have */
/*
Reset Default Start
------------------
*/
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font-weight: normal;
	vertical-align: baseline;
	background: transparent;
}
main, article, aside, figure, footer, header, nav, section, details, summary {display: block;}
html {
	box-sizing: border-box;
}
h1, h2, h3, h4 {
    font-size: 30px !important;
}

body{
    font-family: Montserrat;
}

footer{
    padding-top: 15px;
    padding-bottom: 80px;
}

*,
*:before,
*:after {
	box-sizing: inherit;
}
*:focus {
    outline: none;
}
img,
object,
embed {max-width: 100%;}
ul {

}
b,
strong,.bold {
  font-weight: bold;
}
.list-yellow-color{
    /*padding-left: 20px;*/
}
.fs-12{font-size: 12px;}
.fs-14{font-size: 14px;}
.fs-16{font-size: 16px;}
.fs-18{font-size: 18px;}
.fs-20{font-size: 20px;}
.fs-22{font-size: 22px;}
.fs-24{font-size: 24px;}
.fs-26{font-size: 26px;}
.fs-28{font-size: 28px;}
.fs-30{font-size: 30px;}
.fs-32{font-size: 32px;}
.fs-34{font-size: 34px;}
.fs-36{font-size: 36px;}
.fs-38{font-size: 38px;}
.fs-40{font-size: 40px;}
.text-align-center{text-align: center;}
.text-align-left{text-align: left;}
.text-align-right{text-align: right;}
.clickable,
label,
input[type=button],
input[type=submit],
input[type=file],
button {cursor: pointer;}
input, select {vertical-align: middle;}
table {border-collapse: separate; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}


.clearfix:after { content: " "; display: block; clear: both; }

a{
	text-decoration: none !important;
	cursor: pointer;
}
/*
Reset Default End
------------------
*/

/*
Style From Mockup Start
------------------
*/

a:active,
a:hover {
  outline: 0;
}
a.hyperlink-in-dark, a.hyperlink-in-dark:visited{

}
a.hyperlink-in-dark:hover,a.hyperlink-in-dark.active{

}

a.hyperlink-in-bright, a.hyperlink-in-bright:visited{

}

a.hyperlink-in-bright:hover, a.hyperlink-in-dark.active{

}

a.button-dark, a.button-dark:visited{

}
a.button-dark:hover, a.button-dark.active{

}

a.button-bright, a.button-bright:visited{

}
a.button-bright:hover, a.button-bright.active{

}

h1{
    font-family: Montserrat-Bold !important;
}

h2{
    font-family: Montserrat-Bold !important;
}

h3{
    font-family: Montserrat-Bold !important;
}

h4{
    font-family: Montserrat-Bold;
}

h5{
    font-family: Montserrat-Bold;
}

h6{
    font-family: Montserrat-Bold ;
}
/* .roboto {
    font-family: 'Montserrat-Regular';
} */

.roboto-bold {
    font-family: 'Montserrat-Bold';
}




.title{
	/*judul page*/
}

.subtitle{
	/*judul artikel*/
}

.category{
	/*judul section*/
}
.subcategory{
	/*sub text section*/
}

.content{
	/*judul isinya / summary artikel */
}
.subcontent{
	/*tanggal/ author/ artikel */
}


/*
Style From Mockup End
------------------
*/

/*
Responsive Only Start
------------------
*/
.bullet-inside{
    padding: 0 0 4px 23px;
}

.btn:hover{
    /* font-family: Montserrat !important; */
}
.btn.focus, .btn:focus{
    box-shadow:none!important;
}
.form-control:focus{
    border: none!important;
    box-shadow: none!important;
}
button:focus{
    outline: none!important;
}
button img:focus{
    outline: none!important;
}
.downBlock{
    display: flex;
    align-items: center;
}
.primaryTitle{
    font-size: 30px;
    font-family: Roboto-Regular;
}
.secondaryTitle{
    font-size: 20px;
    font-family: Roboto-Regular;
}
.primaryText{
    font-size: 16px;
    font-family: Montserrat;
}
.primaryTextBold{
    font-size: 16px;
    font-family: Montserrat!important;
}
.descriptionTextScroll{
    overflow-y: scroll;
    max-height: 200px;
}
/* Handle */
.descriptionTextScroll::-webkit-scrollbar-thumb{
    background: #E8CA36;
    border-radius: 10px;
}
/* Handle on hover */
.descriptionTextScroll::-webkit-scrollbar-thumb:hover{
    background: #E8CA36;
}
/* width */
.descriptionTextScroll::-webkit-scrollbar{
    width: 5px;
}
.text-href{
    color: #B89D18;
}
.footer-address p{
    line-height: 20px;
    margin: 0;
}
.addMarginB40{
    margin-bottom: 40px!important;
}
.addMarginT80{
    margin-top: 80px!important;
}
.fullImg{
    width: 100%;
}
::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #c3c3c3!important;
    opacity: 1; /* Firefox */
}
input:focus::placeholder {
    color: transparent;
}
textarea:focus::placeholder {
    color: transparent;
}
.modal-open .modal {
    overflow-x: hidden;
    overflow-y: auto;
    backdrop-filter: blur(3px);
    padding: 0!important;
}
footer{
    background-color: black;
    height: auto;
}
.buttonSearch {
    position: absolute;
    right: 0;
    margin-right: 5px;
    background: #fff;
    border: none;
    cursor: pointer;
}

.breadcrumbs{
    margin-top: 10px!important;
    margin-bottom: 20px;
    padding: 0;
    z-index: 100;
    margin-left: auto;
    margin-right: auto;
    display: block;
    left: 0;
    right: 0;
}
#st-1{
    z-index: 0!important;
}
.breadcrumbs img{
    vertical-align: middle;
}
.breadcrumbs .b-link{
    color:#E8CA36;
    /* font-family: 'Roboto'; */
    font-family: 'Montserrat'!important;
    font-weight: normal;
}
.breadcrumbs .b-link-final{
    color:#B89D18;
    /* font-family: 'Roboto'; */
    font-family: 'Montserrat'!important;
    font-weight: bold;
}
.breadcrumbs a.b-link:hover{
    color:#B89D18;
}
.contactButton {
    position: fixed;
    bottom: 65px;
    z-index: 200;
    right: 65px;
    flex-direction: column;
    display: none;
}
.fab1 {
    cursor: pointer;
    /*display: flex;*/
    /*justify-content: space-evenly;*/
    width: 245px;
    height: 60px;
    /*align-items: center;*/
    /*padding: 12px;*/
    /*background-color: #fff;*/
    /*border-radius: 25px;*/
    margin-bottom: 10px;
}
.fab1-id {
    cursor: pointer;
    /*display: flex;*/
    /*justify-content: space-evenly;*/
    width: 245px;
    height: 60px;
    /*align-items: center;*/
    /*padding: 12px;*/
    /*background-color: #fff;*/
    /*border-radius: 25px;*/
    margin-bottom: 10px;
}
.fab2 {
    cursor: pointer;
    /*display: flex;*/
    /*justify-content: space-evenly;*/
    width: 245px;
    height: 60px;
    /*align-items: center;*/
    /*padding: 12px;*/
    /*background-color: #fff;*/
    /*border-radius: 25px;*/
    margin-bottom: 20px;
}
.fab2-id {
    cursor: pointer;
    /*display: flex;*/
    /*justify-content: space-evenly;*/
    width: 245px;
    height: 60px;
    /*align-items: center;*/
    /*padding: 12px;*/
    /*background-color: #fff;*/
    /*border-radius: 25px;*/
    margin-bottom: 20px;
}
.iconFab {
    width: 245px;
    height: 60px;
}
.textFab{
    font-size: 12px; font-weight: 700; color: #B89D18;
}
.wrapperFloatingBtn {
    position: fixed; bottom: 15px; z-index: 200; right: 20px; display: flex; flex-direction: row; align-items: center
}
.floatingBtn {
    cursor: pointer;
    /*display: flex;*/
    /*justify-content: normal;*/
    height: 60px;
    width: 211px;
    /*border: solid 2px transparent;*/
    /*align-items: center; padding: 8px 0;background-color: #E8CA36; border-radius: 25px;*/
}
.floatingBtn-id {
    cursor: pointer;
    /*display: flex;*/
    /*justify-content: normal;*/
    height: 60px;
    width: 211px;
    /*border: solid 2px transparent;*/
    /*align-items: center; padding: 8px 0;background-color: #E8CA36; border-radius: 25px;*/
}
.scrollToTop {
    background-color: transparent;
    height: 60px;
    width: 60px; display: block!important; cursor: pointer
}
.scrollToTop:hover{
    opacity: 0.7;
}
.reachUsHere {
    font-size: 12px; font-weight: 700; color: #fff;
}
.iconFabRUH {
    width: 36px!important;
    height: 36px!important;
    margin: 6px!important;
}
.footer-mobile{
    display: none!important;
}
.mobile{
    display: none !important;
}
.fabIconHover{
    display: none;
}
#floatingbutton{
    /*border: solid 2px transparent;*/
}
/*#floatingbutton:hover .fabIcon{*/
/*    display: none;*/
/*}*/
/*#floatingbutton:hover .fabIconHover{*/
/*    display: block;*/
/*}*/
/*#floatingbutton:hover{*/
/*    color: #B89D18;*/
/*    border: solid 2px #B89D18;*/
/*}*/
/*.fab1:hover{*/
/*    background-color: #E8CA36;*/
/*}*/
/*.fab2:hover{*/
/*    background-color: #E8CA36;*/
/*}*/
/*.unHovered:hover{*/
/*    display: none;*/
/*}*/
/*.unHovered:hover .hovered{*/
/*    display: block;*/
/*}*/
/*.hovered{*/
/*    display: none;*/
/*}*/
.card{
    transition: box-shadow 0.5s;
    box-shadow:10px 10px 10px -10px rgba(0,0,0,0.5)!important;
}
.card:hover{
	box-shadow: none !important;
}
.news-body .newstabs-item .btn-kuning{
        max-width: 95%;
    }
.news-body .latest1-wrapper,
.news-body .latest1-img,
.news-body .latest23-wrapper{
    height: 300px;
    overflow: hidden;
}

.news-body .latest23{
    width:100%;height:50%;
    overflow: hidden;
}
.news-body .latest23 img{
    max-width:100%;
    height:auto;
    width: 100%;
}
.news-body .card-img-wrapper{
    height: 200px;
}
.news-body .card-body{
    max-height: 145px;
    height: 200px;
    padding: 20px;
}
.card-body{
    height: 200px;
    padding: 20px!important;
}
.card-img-wrapper{
    max-height: 200px;
}

.card-text{
    width: 92%;
}
a.arrowBtn {
    float: none !important;
    position: absolute !important;
    bottom: 10px !important;
    right: 10px !important;
     top: initial !important;
}
#newsList > a.arrowBtn {
    float: none !important;
    position: absolute !important;
    bottom: 10px !important;
    right: 10px !important;
    top: initial !important;
}
.news-body .card-body h4, .news-body .card-body p {
   width:100%;
}
.news-body .panah{
    position: relative;
    top: 0;
}


.news-body .newslink{
    padding-right: 10px;
    padding-left: 10px;
    margin-bottom: 20px !important;
}
.news-body .newswrapper{
    padding-right: 10px;
    padding-left: 10px;
}
.news-body .card-text{
    font-size:14px !important;
}
.news-body .card-title{
    font-size:16px !important;
}
.news-body .card-title .description{
    font-size:12px !important;
}

.card:hover .button-slide-card {
    opacity: 1;
}
.card:hover .arrowBtn{
    opacity: 1;
}
.card:hover .panah1{
    opacity: 1;
}

.panah:hover{
    opacity: 0.5!important;
}

.sourcesanspro-reg {
    font-family: 'Montserrat';
}

.sourcesanspro-bold{
    font-family: 'Montserrat';
}
.card-body-custom{
    height: 160px!important;
}
.btn-transparent-dark-sus {
    color: #382F04 !important;
    border: solid 1px #382F04 !important;
    border-radius: 0 !important;
    width: auto !important;
    height: 50px !important;
    padding: 12px !important;
    background-color: transparent !important;
}

.btn-transparent-dark-sus:hover {
    color: #382F04 !important;
    font-weight: bold !important;
    border: solid 2px #382F04 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    padding: 11px 7px !important;
}

.btn-transparent-dark-custom-home {
    white-space: normal;
    color: #382F04 !important;
    border: solid 1px #382F04 !important;
    border-radius: 0 !important;
    width: 200px !important;
    height: 50px !important;
    padding: 12px !important;
    background-color: transparent !important;
}

.btn-transparent-dark-custom-home:hover {
    color: #382F04 !important;
    font-weight: bold !important;
    border: solid 2px #382F04 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    padding: 11px !important;
}

.btn-transparent-light-custom-home {
    white-space: normal;
    color: #ffffff !important;
    border: solid 1px #FFFFFF !important;
    border-radius: 0 !important;
    width: 200px !important;
    height: 50px !important;
    padding: 12px !important;
    background-color: transparent !important;
}

.btn-transparent-light-custom-home:hover {
    color: #ffffff !important;
    border: solid 1px #FFFFFF !important;
    font-weight: bold !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    padding: 11px !important;
}

.btn-transparent-dark {
    color: #382F04 !important;
    border: solid 1px #382F04 !important;
    border-radius: 0 !important;
    width: 200px !important;
    height: 50px !important;
    padding: 12px !important;
    background-color: transparent !important;
}

.btn-transparent-dark:hover {
    color: #382F04 !important;
    font-weight: bold !important;
    border: solid 2px #382F04 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    padding: 11px !important;
}
.btn-kuning-2 {
    color: white;
    background-color: #E8CA36;
    border-radius: 0;
    width: 200px;
    height: 50px;
    padding: 12px;

}
.btn-kuning-2:hover{
    color: white;
    background-color: #B89D18;
    border-radius: 0;
    padding: 11px;
    font-weight: bold;
    font-family: Montserrat !important;
}
.projectDesc{
    margin-bottom: 40px;
}
.card .card-img-top{
    object-fit: cover;
    height: 100%;
}
@media only screen and (max-width: 1440px) {
    .col-md-10 {
        max-width: 1200px !important;
        min-width: 1200px;
    }
    .col-8 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 66.666667%;
        flex: 0 0 66.666667% !important;
        max-width: 66.666667% !important;
        min-width: 66.666667% !important;
    }

    .container {
        -webkit-box-flex: 0 !important;
        -ms-flex: 0 0 83.333333% !important;
        flex: 0 0 83.333333% !important;
        max-width: 1200px !important;
        min-width: 1200px ;
    }

    .roboto {
        font-family: 'Roboto-Regular';
    }

    .montserrat-bold {
        font-family: 'Montserrat-Bold';
    }

    .roboto-bold {
        font-family: 'Montserrat-Bold';
    }

    .sourcesanspro-reg {
        font-family: 'Montserrat';
    }

    .sourcesanspro-bold{
        font-family: 'Montserrat';
    }
}

    @media only screen and (min-width: 1600px) {
        .btn-kuning-2 {
            color: white;
            background-color: #E8CA36;
            border-radius: 0;
            width: 240px;
            height: 60px;
            padding: 1rem;
        }
        .btn-kuning-2:hover{
            color: white;
            background-color: #B89D18;
            border-radius: 0;
            padding: 15px;
            font-weight: bold;
            font-family: Montserrat !important;
        }
        a.arrowBtn {
            float: right;
            position: relative;
            top: 0;
        }
        .col-9 {
            -webkit-box-flex: 0;
            -ms-flex: 0 0 75%;
            flex: 0 0 75% !important;
            max-width: 75% !important;
            min-width: 75% !important;
        }
        .btn-transparent-dark {
            color: #382F04 !important;
            border: solid 1px #382F04 !important;
            border-radius: 0 !important;
            width: 240px !important;
            height: 60px !important;
            padding: 1rem !important;
            background-color: transparent !important;
        }

        .btn-transparent-dark:hover {
            color: #382F04 !important;
            font-weight: bold !important;
            border: solid 2px #382F04 !important;
            border-radius: 0 !important;
            background-color: transparent !important;
            padding: 0.9375rem !important;
        }

        .btn-transparent-light {
            color: #ffffff !important;
            border: solid 1px #FFFFFF !important;
            border-radius: 0 !important;
            width: 240px !important;
            height: 60px !important;
            padding: 1rem !important;
        }

        .btn-transparent-light:hover {
            color: #ffffff !important;
            font-weight: bold !important;
            border: solid 2px #ffffff !important;
            padding: 0.9375rem !important;
            border-radius: 0 !important;
        }

        .button-slide-reverse {
            height: 40px !important;
            width: 40px !important;
        }

        .button-slide-card {
            height: 40px !important;
            width: 40px !important;
        }

        .news-body .panah1 {
            width: 40px !important;
            height: 40px !important;
        }


        .fb {
            background-size: cover;
            height: 40px !important;
            width: 40px !important;
            cursor: pointer;
        }

        .ig {
            background-size: cover;
            height: 40px !important;
            width: 40px !important;
            cursor: pointer;
        }

        .linked-in {
            background-size: cover;
            height: 40px !important;
            width: 40px !important;
            cursor: pointer;
        }

        .iconYoutube {
            background-size: cover;
            height: 40px !important;
            width: 40px !important;
            cursor: pointer;
        }

        .twitter {
            background-size: cover;
            height: 40px !important;
            width: 40px !important;
            cursor: pointer;
        }

        .followUs {
            width: 190px !important;
        }

        .iconClose {
            background-size: cover;
            height: 40px !important;
            width: 40px !important;
            cursor: pointer;
        }

        .button-slide {
            width: 40px !important;
            height: 40px !important;
        }

        .pinImg {
            background-size: cover;
            width: 53px !important;
            height: 61px !important;
        }

        .pin-1 {
            position: absolute;
            /*width: 40px !important;*/
            top: 0;
            left: 0;
        }

        .pin-2 {
            position: absolute;
            /*width: 40px !important;*/
            top: 35%;
            left: 12%;
        }

        .pin-3 {
            position: absolute;
            /*width: 40px !important;*/
            top: 63%;
            left: 19%;
        }

        .pin-4 {
            position: absolute;
            /*width: 40px !important;*/
            top: 22%;
            left: 30%;
        }

        .pin-5 {
            position: absolute;
            /*width: 40px !important;*/
            top: 5%;
            left: 45%;
        }

        .pin-6 {
            position: absolute;
            /*width: 40px !important;*/
            top: 50%;
            left: 37%;
        }

        .pin-7 {
            position: absolute;
            /*width: 40px !important;*/
            top: 30%;
            left: 53%;
        }

        .pin-8 {
            position: absolute;
            /*width: 40px !important;*/
            top: 71%;
            left: 39%;
        }

        .pin-9 {
            position: absolute;
            /*width: 40px !important;*/
            top: 18%;
            left: 72%;
        }

        .pin-10 {
            position: absolute;
            /*width: 40px !important;*/
            top: 85%;
            left: 61%;
        }

        .pin-11 {
            position: absolute;
            /*width: 40px !important;*/
            top: 75%;
            left: 68%;
        }

        .pin-12 {
            position: absolute;
            /*width: 40px !important;*/
            top: 45%;
            left: 82%;
        }

        .pin-13 {
            position: absolute;
            /*width: 40px !important;*/
            top: 40%;
            left: 92%;
        }

        .pin-14 {
            position: absolute;
            /*width: 40px !important;*/
            top: 63%;
            left: 95%;
        }

        /*map-east*/
        .pinEast-1 {
            position: absolute;
            /*width: 40px !important;*/
            top: 14%;
            left: 20%;
        }

        .pinEast-2 {
            position: absolute;
            /*width: 40px !important;*/
            top: 40%;
            left: 5%;
        }

        .pinEast-3 {
            position: absolute;
            /*width: 40px !important;*/
            top: 70%;
            left: 27%;
        }

        .pinEast-4 {
            position: absolute;
            /*width: 40px !important;*/
            top: 37%;
            left: 25%;
        }

        .pinEast-5 {
            position: absolute;
            /*width: 40px !important;*/
            top: -5%;
            left: 52%;
        }

        .pinEast-6 {
            position: absolute;
            /*width: 40px !important;*/
            top: 31%;
            left: 42%;
        }

        .pinEast-7 {
            position: absolute;
            /*width: 40px !important;*/
            top: 47%;
            left: 55%;
        }

        .pinEast-8 {
            position: absolute;
            /*width: 40px !important;*/
            top: 68%;
            left: 41%;
        }

        .pinEast-9 {
            position: absolute;
            /*width: 40px !important;*/
            top: 18%;
            left: 72%;
        }

        .pinEast-10 {
            position: absolute;
            /*width: 40px !important;*/
            top: 17%;
            left: 83%;
        }

        .pinEast-11 {
            position: absolute;
            /*width: 40px !important;*/
            top: 71%;
            left: 73%;
        }

        .pinEast-12 {
            position: absolute;
            /*width: 40px !important;*/
            top: 14%;
            left: 99%;
        }

        .col-md-10 {
            max-width: 1600px !important;
        }

        .container {
            -webkit-box-flex: 0 !important;
            -ms-flex: 0 0 83.333333% !important;
            flex: 0 0 83.333333% !important;
            max-width: 83.333333% !important;
        }

        .container.videoWrapper {
            -webkit-box-flex: 0 !important;
            -ms-flex: 0 0 83.333333% !important;
            flex: 0 0 83.333333% !important;
            max-width: 83.333333% !important;
        }

        .container.videoWrapper > div {
            padding: 100px 50px 150px !important
        }

        .leaderShip .wrapperThumnail {
            width: 300px !important;
            height: 580px !important;
        }

        /* abbout Us */
        .bannerAboutUs > div {
            /*min-height: 27vw !important;*/
        }

        .bannerAboutOurCompany > div {
            width: 100% !important;
            height: auto !important;
            /*margin: 0 auto 100px !important;*/
        }

        .section-6 img {
            width: 100% !important;
            height: auto !important;
        }

        .section-6 > div, .section-6 > div > div {
            height: auto !important;

        }

        .section-6 > div > div {
            width: 69% !important;
        }

        h1, h2, h3, h4 {
            font-size: 30px !important;
        }

        .head-title h5 {
            font-size: 30px !important;
        }

        .seeourproud-tabs ul li {
            width: 24% !important;
        }

        .seeourproud-tabs {
            display: flex;
            justify-content: space-between;
            text-align: center;
        }

        .coorporateValue .card-title.panel-title {
            font-size: 16px !important;
        }

        .coorporateValue .card-text {
            font-size: 14px !important;
        }

        .coorporateValue .panel-wrapper img {
            max-width: initial !important;
        }

        .coorporateValue .panel-wrapper img {
            max-width: initial !important;
        }

        .coorporateValue .card-img-top {
            width: auto;
        }

        .award .card {
            width: 300px !important;
        }

        .award .card-title {
            text-align: center;
            font-size: 16px !important;
        }

        .award .card-text {
            text-align: center;
            font-size: 14px !important;
        }

        /*news*/
        .news-body {
        }

        .news-body .newstabs {

        }

        .news-body .newstabs-item .btn-kuning {
            max-width: 95%;
        }

        .news-body .latest1-wrapper,
        .news-body .latest1-img,
        .news-body .latest23-wrapper {
            height: 432px;
            overflow: hidden;
        }

        .news-body .latest23 {
            width: 100%;
            height: 50%;
            overflow: hidden;
        }

        .news-body .latest23 img {
            max-width: 100%;
            height: auto;
            width: 100%;
        }

        .news-body .card-img-wrapper {
            height: 280px;
        }

        .news-body .card-body {
            max-height: 200px;
        }

        .news-body .card-body {
            max-height: 160px;
            padding: 20px;
        }

        .card-img-wrapper {
            max-height: 280px;
        }

        .card-body {
            max-height: 200px;
            padding: 20px!important;
        }
        .news-body .panah{
            top: 0;
        }

    }
    @media only screen and (max-width: 1200px) {
        .col-md-10 {
            max-width: 1200px !important;
            min-width: unset;
        }
        .col-8 {
            -webkit-box-flex: 0;
            -ms-flex: 0 0 66.666667%;
            flex: 0 0 66.666667% !important;
            max-width: 66.666667% !important;
            min-width: unset !important;
        }

        .container {
            -webkit-box-flex: 0 !important;
            -ms-flex: 0 0 83.333333% !important;
            flex: 0 0 83.333333% !important;
            max-width: 1200px !important;
            min-width: unset ;
        }
    }
    @media only screen and (max-width: 768px) {
        .card-body-custom{
            height: auto!important;
        }
        .card-body{
            height: auto;
        }
        .bullet-inside-mobile{
            padding: 0 0 4px 23px;
        }
        .secondaryTitle{
            font-size:28px!important;
            margin-bottom: 20px;
        }
        .wrapper-map1 {
            padding-left: 0;
        }

        .footer-desktop {
            display: none !important;
        }

        .footer-mobile {
            display: block !important;
        }
        .news-body .card-body{
            height: auto;
        }
        .card-body{
            height: auto;
        }
        h4 {
            font-size: 24px !important;
        }

    }

    @media only screen and (max-width: 600px) {
        .desktop {
            display: none !important;
        }

        .mobile {
            display: block !important;
        }

        footer {
            height: auto;
            padding-bottom: 50px;
        }

        .navbar-collapse {
            align-items: flex-end;
            background-color: black;
            width: 100%;
            margin: -1px;
            padding: 25px 50px;
        }

        .header {
            position: sticky;
            top: 0;
            position: -webkit-sticky;
            z-index: 999;
        }
    }
    @media only screen and (max-width: 320px) {
        .navbar-collapse {
            align-items: flex-end;
            background-color: black;
            width: 100%;
            margin: -1px;
            padding: 25px 25px;
        }
    }

    /* Desktop HiRes */
    @media only screen
    and (min-device-width: 1501px)
    and (max-device-width: 1920px)
    and (-webkit-min-device-pixel-ratio: 1) {
        .box {
            padding: 50px;
        }

        .thumnail-text {
            padding: calc(100vw * 0.04) calc(100vw * 0.06) calc(100vw * 0.015) calc(100vw * 0.06) !important;
        }
        .thumnail-text p {
            margin: 30px 0;
        }

        .btn-biru {
            width: calc(100vw * 0.1770) !important;
            height: calc(100vw * 0.0346) !important;
        }


        .wrapperThumnail:hover .btn-biru {
            width: calc(100vw * 0.16) !important;
            height: calc(100vw * 0.0346) !important;
            border:#fff solid 3px;
            outline: 1px solid white;
            outline-offset: 4px;
        }
        .buttonThumbnail.btn-biru {
            width: calc(100vw * 0.16) !important;
            height: calc(100vw * 0.0346) !important;
        }
        .buttonThumbnail.btn-biru:hover {
            width: calc(100vw * 0.16) !important;
            height: calc(100vw * 0.0346) !important;
        }

        .contactButton {
            position: fixed;
            bottom: 70px;
            z-index: 200;
            right: 90px;
            display: flex;
            flex-direction: column;
            display: none
        }

        .fab1 {
            cursor: pointer;
            /*display: flex;*/
            /*justify-content: normal;*/
            width: 245px;
            height: 60px;
            /*align-items: center;*/
            /*padding: 12px;*/
            /*background-color: #fff;*/
            /*border-radius: 25px;*/
            margin-bottom: 10px;
        }
        .fab1-id {
            cursor: pointer;
            /*display: flex;*/
            /*justify-content: normal;*/
            width: 245px;
            height: 60px;
            /*align-items: center;*/
            /*padding: 12px;*/
            /*background-color: #fff;*/
            /*border-radius: 25px;*/
            margin-bottom: 10px;
        }

        .fab2 {
            cursor: pointer;
            /*display: flex;*/
            /*justify-content: normal;*/
            width: 245px;
            height: 60px;
            /*align-items: center;*/
            /*padding: 12px;*/
            /*background-color: #fff;*/
            /*border-radius: 25px;*/
            margin-bottom: 15px;
        }
        .fab2-id {
            cursor: pointer;
            /*display: flex;*/
            /*justify-content: normal;*/
            width: 245px;
            height: 60px;
            /*align-items: center;*/
            /*padding: 12px;*/
            /*background-color: #fff;*/
            /*border-radius: 25px;*/
            margin-bottom: 15px;
        }

        .iconFab {
            width: 245px;
            height: 60px;
            margin: 5px;
        }

        .textFab {
            font-size: 14px;
            font-weight: 700;
            color: #B89D18;
        }

        .wrapperFloatingBtn {
            position: fixed;
            bottom: 15px;
            z-index: 200;
            right: 20px;
            display: flex;
            flex-direction: row;
            align-items: center
        }

        .floatingBtn {
            cursor: pointer;
            /*display: flex;*/
            /*justify-content: normal;*/
            height: 60px;
            width: 211px;
            /*align-items: center;*/
            /*padding: 8px 0;*/
            /*background-color: #E8CA36;*/
            /*border-radius: 25px;*/
        }
        .floatingBtn-id {
            cursor: pointer;
            /*display: flex;*/
            /*justify-content: normal;*/
            height: 60px;
            width: 211px;
            /*align-items: center;*/
            /*padding: 8px 0;*/
            /*background-color: #E8CA36;*/
            /*border-radius: 25px;*/
        }

        .scrollToTop {
            background-color: transparent;
            height: 60px;
            width: 60px;
            display: block !important;
            cursor: pointer
        }

        .reachUsHere {
            font-size: 14px;
            font-weight: 700;
            color: #fff;
        }

        .iconFabRUH {
            width: 45px !important;
            height: 45px !important;
            margin: 5px !important;
        }

    }

    /* Desktop */
    @media only screen
    and (min-device-width: 1200px)
    and (max-device-width: 1500px)
    and (-webkit-min-device-pixel-ratio: 1) {
        .btn-biru {
            width: calc(100vw * 0.23) !important;
            height: calc(100vw * 0.05) !important;
        }

        .wrapperThumnail:hover .btn-biru {
            width: calc(100vw * 0.23) !important;
            height: calc(100vw * 0.05) !important;
            outline: 2px solid white;
            outline-offset: 3px;
        }

        .thumnail-text {
            padding: 20px 55px 0!important;
        }
        .thumnail-text p {
            margin: 20px 0;
        }

        .contactButton {
            position: fixed;
            bottom: 65px;
            z-index: 200;
            right: 65px;
            flex-direction: column;
            display: none;
        }

        .fab1 {
            cursor: pointer;
            /*display: flex;*/
            /*justify-content: normal;*/
            width: 245px;
            height: 60px;
            /*align-items: center;*/
            /*padding: 12px;*/
            /*background-color: #fff;*/
            /*border-radius: 25px;*/
            margin-bottom: 10px;
        }

        .fab2 {
            cursor: pointer;
            /*display: flex;*/
            /*justify-content: normal;*/
            width: 245px;
            height:60px;
            /*align-items: center;*/
            /*padding: 12px;*/
            /*background-color: #fff;*/
            /*border-radius: 25px;*/
            margin-bottom: 20px;
        }

        .iconFab {
            width: 245px;
            height: 60px;
            margin: 5px;
        }

        .textFab {
            font-size: 12px;
            font-weight: 700;
            color: #B89D18;
        }

        .wrapperFloatingBtn {
            position: fixed;
            bottom: 15px;
            z-index: 200;
            right: 20px;
            display: flex;
            flex-direction: row;
            align-items: center
        }

        .floatingBtn {
            cursor: pointer;
            /*display: flex;*/
            /*justify-content: normal;*/
            height: 60px;
            width: 211px;
            /*align-items: center;*/
            /*padding: 8px 0;*/
            /*background-color: #E8CA36;*/
            /*border-radius: 25px;*/
        }

        .scrollToTop {
            background-color: transparent;
            height: 60px;
            width: 60px;
            display: block !important;
            cursor: pointer
        }

        .reachUsHere {
            font-size: 12px;
            font-weight: 700;
            color: #fff;
        }

        .iconFabRUH {
            width: 36px !important;
            height: 36px !important;
            margin: 6px !important;
        }
    }


    /* Ipad */
    @media only screen
    and (min-device-width: 600px)
    and (max-device-width: 1199px)
        /*and (orientation: portrait)*/
    and (-webkit-min-device-pixel-ratio: 1) {
        .btn-biru {
            width: calc(100vw * 0.26) !important;
            height: calc(100vw * 0.06) !important;
        }

        .wrapperThumnail:hover .btn-biru {
            width: calc(100vw * 0.26) !important;
            height: calc(100vw * 0.06) !important;
            outline: 2px solid white;
            outline-offset: 3px;
        }

        .thumnail-text {
            padding: calc(100vw * 0.02) calc(100vw * 0.06) calc(100vw * 0.015) calc(100vw * 0.06) !important;
        }
        .thumnail-text p {
            margin: 20px 0;
        }

    }


    /* IphoneX */
    @media only screen
    and (max-device-width: 599px)
    and (-webkit-min-device-pixel-ratio: 3)
    and (orientation: portrait) {
        .col-md-10 {
            /*max-width: 1200px !important;*/
            min-width: 1px !important;
        }


        .container {
            -webkit-box-flex: 0 !important;
            -ms-flex: none !important;
            flex: none !important;
            /*max-width: 1200px !important;*/
            min-width: 1px !important;
        }
    }

    /*
    Responsive Only End
    ------------------
    */
    @font-face {
        font-family: Roboto-Bold;
        src: url('../font/RobotoCondensed-Bold.ttf');
    }
    @font-face {
        font-family: Roboto-Bolditalic;
        src: url('../font/RobotoCondensed-BoldItalic.ttf');
    }
    @font-face {
        font-family: Roboto-italic;
        src: url('../font/RobotoCondensed-Italic.ttf');
    }
    @font-face {
        font-family: Roboto-light;
        src: url('../font/RobotoCondensed-Light.ttf');
    }
    @font-face {
        font-family: Roboto-lightitalic;
        src: url('../font/RobotoCondensed-LightItalic.ttf');
    }
    @font-face {
        font-family: Roboto-Regular;
        src: url('../font/RobotoCondensed-Regular.ttf');
    }
    @font-face {
        font-family: SourceSansPro-Black;
        src: url('../font/SourceSansPro-Black.ttf');
    }
    @font-face {
        font-family: SourceSansPro-BlackItalic;
        src: url('../font/SourceSansPro-BlackItalic.ttf');
    }
    @font-face {
        font-family: SourceSansPro-Bold;
        src: url('../font/SourceSansPro-Bold.ttf');
    }
    @font-face {
        font-family: SourceSansPro-BoldItalic;
        src: url('../font/SourceSansPro-BoldItalic.ttf');
    }
    @font-face {
        font-family: SourceSansPro-ExtraLight;
        src: url('../font/SourceSansPro-ExtraLight.ttf');
    }
    @font-face {
        font-family: SourceSansPro-ExtraLightItalic;
        src: url('../font/SourceSansPro-ExtraLightItalic.ttf');
    }
    @font-face {
        font-family: SourceSansPro-Light;
        src: url('../font/SourceSansPro-Light.ttf');
    }
    @font-face {
        font-family: SourceSansPro-LightItalic;
        src: url('../font/SourceSansPro-LightItalic.ttf');
    }
    @font-face {
        font-family: SourceSansPro-Regular;
        src: url('../font/SourceSansPro-Regular.ttf');
    }
    @font-face {
        font-family: SourceSansPro-RegularItalic;
        src: url('../font/SourceSansPro-RegularItalic.ttf');
    }
    @font-face {
        font-family: SourceSansPro-SemiBold;
        src: url('../font/SourceSansPro-SemiBold.ttf');
    }
    @font-face {
        font-family: SourceSansPro-SemiBoldItalic;
        src: url('../font/SourceSansPro-SemiBoldItalic.ttf');
    }
    .itemLinkPad {
        padding: 0 calc(100vw * 0.01) 0 0 !important;
        font-family: "Montserrat" !important;
    }



/* styles for '...' */
.block-with-text {
 overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.block-with-text-1-line {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.block-with-text-2-line {
  overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}