@media all and (max-width: 640px) {
    :root {
        --main-bg-element1:'../img/element2.png';
        --main-bg-element2:'../img/element3.png';

      }
    /* .whoweare-pinc,
    #whatwedo,
    #ouroffer{
        background-image: url()!important; 
        opacity: 1;
    } */
    
    .section-title-bar{
        
        
    }

        .partnerdetail{
    

        opacity: 1!important;
        display: block!important;
            margin-left: 38%!important;
        text-align: center;
    
}

  .visiblediv {
      display: block;
  }

  .hiddendiv {
      display: none;
  }


.brandtext a> svg{
           padding: 0 0px 
    }

.read-more button:active{
        color: grey;
    }


    .logo a h4 {
        display: none;
        
    }

.desklogo{

    display: none;
}

.moblogo{
    width: 100%;
    display: block;
}

.read-more{
        opacity: 1;
        width: auto;
        height: auto;
        display: flex!important;
        justify-content: center!important;
        align-items: center!important;
        margin-top: 30px!important;
        margin-bottom: 10px!important;
        text-transform: uppercase   ;
    }

    .read-more a{
        border: 0px solid  #d6167f;
    }

    .read-more button{
        border: 1px solid #d6167f;
        background-color: transparent;
        color: #d6167f;
    }



    .box-category {
    padding: 2px;
    margin-bottom: 10px;
}
.box-category h3 {
    position: absolute;
    padding: 0 5px;
    margin-top: -2px;
    color: #fff;
    /* font-size: 15px; untuk mobile*/
    width: 100%;

}
.box-menu{
    position: absolute;
    text-align: right;
    right: 10px;
}
.box-menu button{
    background-color: Transparent;
    background-repeat:no-repeat;
    border: none;
    cursor:pointer;
    overflow: hidden;
    outline:none;
    color: #000!important;
}
.dropdown-menu{
    text-align: right;
    right: 0!important;
    left: unset;
}

    .imgdiagram{
        width: 400px;
        margin-left: -5%;
        margin-top: -20%;
    }

    .nokerning{
        font-size: 10px!important;
        letter-spacing: 0pt!important;
        line-height: 15px!important;
    }

        .nokerning a{
        line-height: 25px!important;
    }

    .mainmenu .navbar-nav li a{
        text-align: right;

    }

    .logo{
        width: 720px;
    margin-bottom: -10px;
    }

   .dont-collapse-sm {
                display: none;
                height: auto !important;
              }
    
    .paragon-nav{
    	font-family: Roboto!important; 
    	font-weight: 300;
    opacity: 1;
    position: absolute;
    transition: 0s;
    top: -10%;
    left: auto;
    display: block;
    text-align: left;
    padding-left: 10%;
    padding-top: 3%;

    }

     .home-image-area {
        position: relative;
        background-position: 50% 100%!important;
        height: 88%;
        background-image: url(../img/BANNER.png);
        background-repeat: no-repeat;
        z-index: 1;
        margin-top: 20%;
    } 

    .rounded-circle{
            max-width: 75%!important;
    }

/*    .header-top-area{
        height: 6%!important;
    }*/
    .navbar-toggle{
        top: 0!important;
    }
    .section-title-1 h2{
        /* top: 8px;
        right: 13px;
        font-size:19px;
        text-align: center;
        display: inline;
        position: relative; */
        opacity: 0;
        margin: 0!important;
        padding: 0!important;
    }
    .section-subtitle-1 h2{
        /* display: inline;
        font-size: 12px;
        padding-left: 10px !important;
        right: -30px; */
        opacity: 0;
        margin: 0!important;
        padding: 0!important;
    }
    .whoweare-desc{

        margin-top: 0px!important;
        letter-spacing:0px;
            margin-bottom: 20%;
                margin-left: 6%!important;
    
    }
    .whoweare-pinc{
        background-image: url('../img/MOBILE-MENU__1.png')!important;
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-size: 100%;
        background-position: 195% 60%;
        margin-top: 8%;
        width: 100%!important;
        height: auto;
    }

    #whatwedo{
        background-image: url('../img/MOBILE-MENU__2.png')!important;
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-size: 100%!important;
        background-position: 195% 60%;
        margin-top: 5%!important;
        width: 100%!important;
        height: auto;
    }
    .whatwedo-p{
        margin-top: -20px!important;
    }

    #ouroffer{
        background-image: url('../img/MOBILE-MENU__3.png')!important;
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-size: 100%!important;
        background-position: 195% 60%;
        margin-top: ;
        width: 100%!important;
        height: auto;
    }
    #companies{
        background-image: url('../img/MOBILE-MENU__4.png')!important;
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-size: 100%!important;
        /* background-position: 195% 60%; */
        margin-top: 8%;
        width: 100%!important;
        /* height: auto; */
    }
    #partners{
        background-image: url('../img/MOBILE-MENU__5.png')!important;
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-size: 100%!important;
        /* background-position: 195% 60%; */
        margin-top: 8%;
        width: 100%!important;
        height: auto;
    }
    #thework h2{
        opacity: 0!important;
        height: 0;
        width: 0;`
    }

    
    .thework-title{
        /*background-image: url('../img/img_bar/element7.png')!important;*/
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-size: 100%!important;
         background-position: 195% 60%; 
        margin-top: 8% !important;
        width: 100%!important;
        height: auto;
    }
    
    .bg-blog{
      /*  background-image: url('../img/img_bar/element8.png')!important;*/
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-size: 100%!important;
        /* background-position: 195% 60%; */
        margin-top: 0%!important;
        width: 100%!important;
        height: auto;
    }

    .read-more button:focus{
        outline-style: none;
    }
    

    .whoweare-p{
        margin-top: -50px;
    }

    .ouroffer-p{
        margin-top: -20px;
    }

    .pinc-img{
        margin-bottom: 5%;
        margin-left: -4%;
        width: 108%!important;
        padding-bottom: 10%!important;
    }
    .diagram-img{
        width: 0;
        opacity: 0;
        height: 0%;
    }
    .companiestitle h2{
        /* margin-top: 5px !important; */
        /* font-size: 25px!important; */
        opacity: 0;
        width: 0;
        height: 0;
    }
    .mediadekstop{
        width: 100%;
        margin-left: 10%;

    }
    .brandimg{
        width: 80%!important;
        height: 100%!important;
        display: block!important;
        text-align: center!important;
        padding: 5%!important;
        margin-left: unset;
    }
    .brandtext p {
        margin-right: unset;
        width: 80%;
        font-size: 15px!important;
        letter-spacing: 0px!important;
        margin-left: 5%;
    }

    .visitcenter{
            margin-left: 25%;

    }

    


    #partners h2{
        /* position: relative;
        top: 20px;
        left: 5px;
        font-size: 20pt;
        text-align: center!important; */
        opacity: 0;
        width: 0;
        height: 0;

    }
    .img-fluid{
        text-align: center!important;
    }
    
    .img-partner{
        text-align: center!important;
    }
    .title-name{
        font-size: 20px!important;
        text-align: center;
    }
    .title-degree{
        text-align: center!important;
        font-size: 20px!important;
    }
    .partner-page{
        text-align: center!important;
    }
    #blog{
        padding-top: 5px!important;
    }

    #blog h2{
        /* font-size: 25px!important; */
        /* margin-bottom: 30px!important; */
        opacity: 0;
        width: 0;
        height: 0;
    }
    .bgcontact{
        background-image: url('../img//MOBILE-MENU__8.png')!important;
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-size: 100%!important;
        background-position: 45% -5%!important;
        margin-top: 1%!important;
        width: 100%!important;
        height: auto;
    } 

  .footer-left-mobile{
        margin-left: -70px!important;
    }

    .footer-left {
    text-align: left;
    font-weight: bold;
    top: 30px;
    font-size: 10px!important;
}

.footer-right {
    text-align: left;
    top: 30px;
    font-size: 10px!important;
        line-height: 15px!important;
}

    .maps{

        margin-top: 20%!important;
    }
    
    #contact h2{
        /* font-size: 30px!important; */
        /* padding-top:10pt !important; */
        width: 0;
        padding: 0;
        height: 0;
        opacity: 0;
    }
    .linked img{
        width: 10%!important;
        height: 10%!important;
            margin-left: 8%!important;
    }
    .hr-partners{
        text-align: center!important;
        width: 30%!important;
        margin-left: 35% !important;
    }

    #thework h2{
        font-size: 20pt !important;
        margin-bottom: -5px;
    }

    .media-heading{
        font-size: 20px !important;
    }
    .media-body-article{
        font-size: 18px !important;
    }
    .media{
        padding-top: 5px;
    }

}

@media only screen and(width-max:320px){
    .brandtext{
        width: 65%!important;
    }
}