@media screen and (max-width:1300px) {
.card-img-top {
height: 20vw;
}
}
@media screen and (max-width: 1199px){
#imgrotate {
height: 300px;
 width: 100%;
}
.imgabsolute{
left: 33%;
}
}
@media screen and (max-width: 991px){
#imgrotate {
height: 250px;
}
.imgabsolute{
left: 20%;
}
.imgabsolute img{
width: 95%;
}
.mytabitem {
     
  font-size: 0.85rem; color: rgba(0,0,0);
 
}
}
@media screen and (max-width:767px) {
.card-img-top {
height: 30vw;
}
#imgrotate {
height: 400px;
 width: 100%;
}
.imgabsolute{
left: 21%;
}
}

@media (max-width: 768px) {
    .display-1 {
      font-size: 3.4rem;
      font-size: calc( 2.1374999999999997rem + (4.25 - 2.1374999999999997) * ((100vw - 20rem) / (48 - 20)));
      line-height: calc( 1.4 * (2.1374999999999997rem + (4.25 - 2.1374999999999997) * ((100vw - 20rem) / (48 - 20))));
    }
    .display-2 {
      font-size: 2.4rem;
      font-size: calc( 1.7rem + (3 - 1.7) * ((100vw - 20rem) / (48 - 20)));
      line-height: calc( 1.4 * (1.7rem + (3 - 1.7) * ((100vw - 20rem) / (48 - 20))));
    }
    .display-4 {
      font-size: 0.8rem;
      font-size: calc( 1rem + (1 - 1) * ((100vw - 20rem) / (48 - 20)));
      line-height: calc( 1.4 * (1rem + (1 - 1) * ((100vw - 20rem) / (48 - 20))));
    }
    .display-5 {
      font-size: 1.2rem;
      font-size: calc( 1.175rem + (1.5 - 1.175) * ((100vw - 20rem) / (48 - 20)));
      line-height: calc( 1.4 * (1.175rem + (1.5 - 1.175) * ((100vw - 20rem) / (48 - 20))));
    }
    .media-content {
        -webkit-flex-basis: 100%;
        flex-basis: 100%;
    }
    .editable {
      font-size: 0.8rem;
      font-size: calc( 1rem + (1 - 1) * ((100vw - 20rem) / (48 - 20)));
      line-height: calc( 1.4 * (1rem + (1 - 1) * ((100vw - 20rem) / (48 - 20))));
      padding-right: 15px;
      padding-left: 15px;
      margin-right: auto;
      margin-left: auto;
    }
    .mytabitem {
     
      font-size: 0.85rem; color: rgba(0,0,0);
     
   }
  }
  @media screen and (max-width:575px) {
    .paparan_penuh { display: block; }
    .paparan_mobile { display: none; }
    .menu-border-right:not(:last-child):after {
      display: none;
    }
    .navbar .dropdown-menu {
      
      width: 100%;
 
    }
    .navbar {
      margin: 7.5px 0px;
      }
      .navbar .nav > li {
          display: block;
      }
      .navbar .nav > li  img {
          margin: auto;
      }
    .card-img-top {
    height: 40vw;
    }
    #imgrotate {
    height: 400px;
	width: 100%;
    }
    .imgabsolute{
    left: 20%;
    top: 5%;

    }
    .imgabsolute img {
    width: 200px;
    }
	.content-area .container img {
		width:90%; 
	}
    .off-carousel-item img {  
      margin:0 -78.885%;
      width:177.777%; 
    }
    .bn-label { display: none !important;}
    .con-navbara { float:right; clear: both;}
    .logo-topa { float: left; width: 50%;}
    .logo-top img { width: 100%;}
    
    .footer-item-menu { float: left;}
    .footer-item-menu  ul li { float:left; list-style:none;  }
     .footer-item-menu  ul li:after {
      
      display: none; 
     }
     .footer-item-menu  ul li {
      
      width: 100%;
      border-bottom: 1px gray solid;
      height: 25px;
     }
     .card-body.tabawam > div.tabawam-header > button { 
      font-size: 0.60rem; 
    }
      .mytabitem {
        font-size: 0.55rem;
      }
      .gxbreadcrumb { 
       display: none;
      }

      .gxbreadcrumb li a {
        font-size: 0.6s5rem;
        color: white;
        text-decoration: none; 
        padding: 10px 0 10px 65px;
        background: rgb(34, 32, 32); /* fallback color */
        background: rgb(31, 18, 2); 
        
        position: relative; 
        display: block;
        float: left;
      }
      .gxbreadcrumb li a::after { 
        content: " "; 
        display: block; 
        width: 0; 
        height: 0;
        border-top: 10px solid transparent; /* Go big on the size, and let overflow hide */
        border-bottom: 10px solid transparent;
        border-left: 10px solid rgb(17, 17, 16);
        position: absolute;
        top: 10%;
        margin-top: -10px; 
        left: 100%;
        z-index: 2; 
      }
      .gxbreadcrumb li a::before { 
        content: " "; 
        display: block; 
        width: 0; 
        height: 0;
        border-top: 10px solid transparent;       
        border-bottom: 10px solid transparent;
        border-left: 10px solid white;
        position: absolute;
        top: 50%;
        margin-top: -10px; 
        margin-left: 1px;
        left: 100%;
        z-index: 1; 
      }

      .rolink {
        height: 280px; margin: auto; overflow: hidden;
        width: 175px; 
        float: left;
      }
      .rolink img {
        width: 160px; 
        object-fit: contain; 
      }
    }