.hl-medsos{background:#1F1F1F;box-sizing:border-box;padding:3% 0}
.hl-medsos h2{font-size:270%;color:white;text-align:center}
.desc_ {padding: 0;}
ul.hl-ls-md{margin:2% auto;width: 20%;}
ul.hl-ls-md li{list-style:none;width:40%;box-sizing:border-box;margin:0;float: left;}
ul.hl-ls-md li img{width:100%}
/*=======================================================*/
.av-page{padding-top:5%;}
.av-abt-content{padding-bottom:0}
.av-row{width:100%;float:left}
.av-img-content{width:100%;float:left;height: 30vh;}
.av-img-contnt-abt{background: linear-gradient(rgba(0, 0, 0, 0.3),rgba(0, 0, 0, 0.5)),url(https://avantguard.co.id/img/HALL_FUTSAL-PORIS_TANGERANG.jpg);background-size: cover;background-repeat: no-repeat;}
.av-text-content{width:100%;float: left;}
.av-text-content h1{text-align: center;padding: 5% 0;font-weight: bold;color:white;font-size:32pt}
.av-contain{width:95%;margin:0 auto}
.av-content-style{padding:5% 0}
.av-content-abt-style{border-bottom:1px solid #ddd}
.av-h-col{width:50%;float:left}
.av-col-mid-style{padding:0 7%;padding-left: 0;}
.av-col-mid-style p{line-height: 25pt;text-align: justify;font-size: 12.5pt;line-height: 30px}
.av-content-abt-img{background: url(https://avantguard.co.id/img/HOTEL_SERUNI-PUNCAK.jpg);background-position: center;background-size: cover;height:40vh}
.av-contet-video-abt video{width:95%;}
.av-content-abt-fll{height:50vh;background: linear-gradient(rgba(0, 0, 0, 0.7),rgba(0, 0, 0, 0.5)),url(https://avantguard.co.id/img/AMARTA-BUILDING.jpg);
  background-size: cover;
  background-repeat: no-repeat;}
.av-content-style-btm{padding-top:5%}
.av-content-abt-style{border-bottom:1px solid #ddd}
.av-content-btm-style p{color:white;line-height: 25pt;text-align: justify;padding: 5%;font-size: 12pt;}
/*-------------------*/
.hl-abts{height: 75%;display: grid;box-sizing: border-box;padding:5%}
.hl-row{width:100%;float:left;}
.hl-abts-info{box-sizing: border-box;display: grid;grid:50vh/ 40% 60%;}
.hl-text-info p{text-align: justify;line-height: 30px;margin-top:0;font-size: 12.5pt;}
.hl-text-info p a{text-decoration: none;color:#ffc600;transition:all .5s;}
.hl-text-info p a:hover{color:#9c7d11;}
.hl-img-info{background:url(https://hololite.co.id/img/hololite-upvc-roof.jpg);background-size: cover;background-repeat: no-repeat;}
.hl-video{height: 90vh;box-sizing: border-box;padding: 3% 5%;background:white;background-size: cover;padding-top: 0;}
.hl-video-tmp{width:80%;margin:0 auto;box-sizing: border-box;}
.hl-video-tmp video{width: 100%;height: 100%}
.hl-content{box-sizing: border-box;padding: 5% 0;}
ul.sup-nav li.sup-ch-drop:hover .hld-end-ls{display:block;}
ul.sup-nav li.sup-ch-drop ul.hld-end-ls{position:absolute;width:100%;background:#E8E8E8;padding:0;top: 0;right: 100%;display:none;transition:all 0.3s;z-index:9;}
ul.sup-nav li.sup-ch-drop ul.hld-end-ls li.hld-ens-ls-pt{list-style:none;font-size:11pt;width:100%;float:left;transition:all 0.3s;color:#333}
ul.sup-nav li.sup-ch-drop ul.hld-end-ls li.hld-ens-ls-pt a{padding:10px 10px;width:100%;float:left;line-height:15px;font-size:11pt;transition:all 0.3s;color:#333}
ul.sup-nav li.sup-ch-drop ul.hld-end-ls li.hld-ens-ls-pt:hover{background:#333;}
ul.sup-nav li.sup-ch-drop ul.hld-end-ls li.hld-ens-ls-pt:hover a{color:white;}
ul.sup-nav li.sup-ch-drop ul.hld-end-ls li.hld-ens-ls-pt:hover li.sup-ch-drop{color:#333}
/*========================================*/
ul.m-subcolchl li.hlc-msb-chl-drp:hover ul.hlc-m-sb-chl{display:block;}
ul.hlc-m-sb-chl{position:absolute;width:175px;left:-100%;padding:0;margin:0;background:#f1f1f1;box-shadow:0px 0px 5px #999;display:none;}
ul.hlc-m-sb-chl li.hlc-m-sb-chl-lst{list-style:none;width:100%;float:left;}
ul.hlc-m-sb-chl li.hlc-m-sb-chl-lst a{text-decoration:none;color:black;padding:4% 0;}
@media(max-width:1024px){
    .hl-medsos h2 {font-size: 220%;}
    ul.hl-ls-md {margin: 0 auto;width: 30%;}
    ul.hl-ls-md li {width: 40%;margin: 0;}
}
@media(max-width:768px){
    .hl-medsos h2 {font-size: 220%;}
    ul.hl-ls-md {margin: 0 auto;width: 75%;}
    ul.hl-ls-md li {width: 40%;margin: 0;}
    ul.m-subcolchl {width: 150px;left: -98%;}
    ul.hlc-m-sb-chl{left: -118%;}
    .av-text-content h1{padding: 14% 0;font-size: 24pt;}
}
@media (max-width: 640px){
    .carousel-caption {padding-bottom: 10px;}
    .carousel-caption h2{font-size: 20pt;}
    .title-desc {font-size: 10pt;}
    .btn-large {padding: 3px 25px;font-size: 15px;}
    .btn-transparent{border: 0.5px solid #fff;}
    ul.hl-ls-md{width: 40%;}
    .backToTop{bottom: 30px;}
    ul.mnav-bar{width: 120px;top: 80px;right: 155%;}
    ul.mnav-bar li.m-chl a {font-size: 10pt;}
    ul.m-subchl{width: 100px;left: -84%;}
    ul.m-subcolchl {width: 110px;left: -111%;}
    ul.hlc-m-sb-chl{left: -132%;width: 145px;}
}
@media (max-width: 480px){
    .carousel-caption {padding-bottom: 70%;}
    .im-nav i {padding-top: 50%;}
    ul.mnav-bar{right: 15%;}
    ul.m-subchl{width: 90px;}
    ul.m-subcolchl{left: -116%;}
    ul.hlc-m-sb-chl {left: -117%;width: 135px;}
    ul.hl-ls-md {width: 70%;}
    .cl-hol {width: 50%;float: left;min-height: 16vh;}
}
@media(max-width:430px){
.flag {width: 31%;}
.logo {width: 85%;padding-top: 2%;}
.im-nav {left: -60%;}
.im-nav i {font-size: 20pt;padding-top: 90%;padding-left: 150%;}
ul.mnav-bar {width: 120px;top: 75px;left: -75px;}
ul.mnav-bar li.m-chl a {font-size: 10pt;}
ul.m-subchl {width: 90px;left: -75%;}
ul.m-subcolchl {width: 100px;left: -99%;}
ul.m-subcolchl li.msublistchl a {padding: 4% 5%;}
ul.hlc-m-sb-chl{width: 100px;left: -95%;}
.ch-frl-2 {margin-top: 0;}
.backToTop {font-size: 25pt;height: 40px;width: 40px;right: 20px;}
.hol-disply {background:linear-gradient(rgba(0, 0, 0, 0.4),rgba(0, 0, 0, 0.5)),url('../img/holodeck full color.jpg');background-size: cover;z-index: 0;width: 100%;}
.hol-desc {min-height: 405px;}
.hol-desc h3 {color:white;}
.hol-desc p {color:white;font-size: 12pt;}
.adds-ic {color: white;width: 100%;text-align: center;padding-bottom: 3%;}
.social-ic{margin: 0 auto;width: 60%;}
.social-ic li {list-style: none;width: 25%;float: right;text-align: center;}
.adds-ic h4 {font-size: 20pt;}
.adds-ic p {font-size: 10pt;}
.footer-logo{padding: 2% 0;text-align: center;}
.flr-2 img {width: 70%;text-align: center;}
.cl-hol{width: 50%;float: left;min-height: 110px;}
.col-about-right {display:none;}
.about {background-attachment: fixed;height: 102%;}
.plc-ovr {position: relative;width: 100%;padding-top: 15%;float: left;left: 0;}
.text-alient {position: relative;width: 90%;margin: 0 auto;right: 0;}
.text-prgraf {position: relative;width: 90%;left: 0;margin: 0 auto;padding: 5% 0;}
.text-prgraf p {line-height: 25px;color: white;font-size: 10pt;padding: 0;}
.img-page video {height: 490px;}
.title-page h1, .adv-desc-info h1, .desc-info h1, .sound-page h1 {font-size: 24pt;}
.title-page p, .adv-desc-info p , .desc-info p, .sound-page p {line-height: 20px;font-size: 10pt;}
.desc-info p {padding:5px 0;}
.info-coros h1 {margin:15px 0;font-size: 24pt;}
.diff-coro h2 {font-size: 18pt;}
.flex-bg {height: 70%;}
.title-page {padding-top: 70%;}
.adv-info {padding-top: 10%;}
.info-coros-head {margin-top: 14%;}
.adv-desc-info {padding-top: 20%;}
.sound-page {padding-top: 65%;}
.sec-padd{padding-top:10%;}
.sec-padd-spe{padding-top:5%}
.sec-padd-gal{padding-top:20%;}
.col-acc {width: 100%;}
.event-frame, .video-gallery {min-height:80px;}
.form-video {margin: 63% auto;}
.event-list {width: 27.5%;height: 60px;}
.video iframe {min-height: 280px;}
.col-blog-1, .col-blog-2{width: 100%;}
.row-col-2 {width: 50%;}
.col-blog-style {min-height: auto;}
.next-blog {margin: 0 0 7%;}
.list-news li {width: 44.5%;min-height: 245px;}
.content {padding-top: 7%;}
.col-half-1, .col-half-2 {width: 100%;}
.title-view-list {padding: 10px 5px;font-size: 10pt;}
.loc-1 {bottom: 350px;left: 90px;}
.loc-2 {bottom: 335px;left: 110px;}
.loc-3 {bottom: 327px;left: 135px;}
.loc-4 {bottom: 324px;left: 160px;}
.loc-5 {bottom: 317px;left: 180px;}
.loc-6 {bottom: 348px;left: 220px;}
.desc-loc {width: 280px;border: 2px solid #E3B200;}
hr.line-compa {margin: 2px 0;}
.company h4 {margin: 5px 0;font-size: 12pt;}
.form-distri {width: 100%;}
.col-page {width: 100%;}    
.list-spec-detail {float: left;min-height: 210px;width: 50%;}
.btn-gallery {font-size: 11pt;padding: 5px 10px;}
.event-frame {width: 30.5%;}
.form-video iframe {width: 100%;min-height: 220px;}
.headline-title h1 {font-size: 12pt;}
.blog-overlay h2 {font-size: 9pt;line-height: 18px;}
.list-news li a h3 {font-size: 10pt;}
.post {width: 3%;}
/*-------------------------------------*/
.w-panel-info {width: 100%;min-height: 370px;}
.col-w-style {font-size: 9pt;}
.w-panel-info h2 {font-size: 18pt;}
.col-w-style p{padding:5px;}
.hl-medsos h2 {font-size: 220%;}
ul.hl-ls-md {margin: 0 auto;width: 75%;}
ul.hl-ls-md li {width: 40%;margin: 0;}
/*=======================================*/
.av-h-col {width: 100%;padding:0}
.av-content-abt-fll {height: 70vh;}
.av-text-content h1 {padding: 25% 0;font-weight: normal;font-size: 20pt;}
.hl-abts{padding: 20% 5%;}
.hl-abts-info {box-sizing: border-box;display: block;grid: none;}
.hl-text-info{width: 100%;float: left;}
.hl-img-info{width: 100%;float: left;height: 25vh;}
.hl-video {height: 35vh;}
.av-contet-video-abt video {width: 100%;}
}
@media(max-width:420px){
.hl-medsos h2 {font-size: 220%;}
ul.hl-ls-md {margin: 0 auto;width: 75%;}
ul.hl-ls-md li {width: 40%;margin: 0;}
}
@media(max-width:400px){
ul.mnav-bar {width: 110px;top: 75px;left: -60px;}
ul.mnav-bar li.m-chl a {font-size: 9pt;}
}
@media(max-width:380px){
.hl-medsos h2 {font-size: 220%;}
ul.hl-ls-md {margin: 0 auto;width: 75%;}
ul.hl-ls-md li {width: 40%;margin: 0;}
}
@media(max-width:360px){
ul.mnav-bar li.m-chl a{padding: 5% 0;}
ul.mnav-bar {width: 95px;top: 65px;left: -50px;}
.hl-medsos h2 {font-size: 125%;}
}