/* lg */ 
@media (min-width: 1200px) {
 /* Make Navigation Toggle on Desktop Hover */
  .dropdown:hover .dropdown-menu {
      display: block;
      -webkit-animation: fadeInUp 400ms;
      animation: fadeInUp 400ms;
  }

  #portfolio .row {
    margin-left: -10px;
    margin-right: -10px;
  }

  

}

/* md */
@media (min-width: 992px) and (max-width: 1199px) {
  
 /* Make Navigation Toggle on Desktop Hover */
  .dropdown:hover .dropdown-menu {
      display: block;
      -webkit-animation: fadeInUp 400ms;
      animation: fadeInUp 400ms;
  }

  .navbar-nav > li {
    margin-left: 10px;
  }

  .navbar-collapse {
    padding-left: 0;
    padding-right: 0;
  }

  .recent-work-wrap .recent-work-inner h3 a {
    font-size: 20px;
  }

  .recent-work-wrap .overlay{
    padding: 15px;
  }

  .services-wrap {
    padding: 40px 10px 40px 30px;
  }

  .feature-wrap h2, 
  .single-services h2 {
    font-size: 18px;
  }

  .feature-wrap h3, 
  .single-services h3{
    font-size: 14px;
  }

  .tab-wrap .media .parrent.pull-left{
    clear: both;
    width: 100%;
  }

  .tab-wrap .media .parrent.media-body{
    clear: both;
  }

  #history .row img{
    padding-top: 20px;
  }

  .recent-work-wrap .overlay .preview{
    line-height: inherit;
  }

  .team-bar .first-arrow {
    width: 21%;
  }

  .team-bar .second-arrow {
    width: 20%;
  }

  .team-bar .third-arrow {
    width: 21%;
  }

  .team-bar .fourth-arrow {
    width: 20%;
  }

  ul.social_icons li{
    margin-right: 0;
  }

}


/* sm */
@media (min-width: 768px) and (max-width: 991px) {
  /* Make Navigation Toggle on Desktop Hover */
  .dropdown:hover .dropdown-menu {
      display: block;
      -webkit-animation: fadeInUp 400ms;
      animation: fadeInUp 400ms;
  }

  .navbar-collapse {
    padding-left: 0;
    padding-right: 0;
  }

  .navbar-nav > li {
    margin-left: 0;
  }

  #history .row img{
    padding-top: 20px;
  }

  #main-slider .carousel h1 {
    font-size: 25px;
  }

  #main-slider .carousel h2 {
    font-size: 20px;
  }

  #mini-slider .carousel h1 {
    font-size: 25px;
  }

  #mini-slider .carousel h2 {
    font-size: 20px;
  }

  .tab-wrap .media .parrent.pull-left, 
  .media.accordion-inner .pull-left{
    clear: both;
    width: 100%;
  }

  .tab-wrap .media .parrent.media-body, 
  .media.accordion-inner .media-body{
    clear: both;
  }

  .services-wrap {
    padding: 40px 0 40px 30px;
  }

  .recent-work-wrap .overlay{
   padding: 15px;
  }

  .recent-work-wrap .recent-work-inner h3 a {
    font-size: 20px;
  }

  .sinlge-skill{
    width: 150px;
    height: 150px;
  } 

  .sinlge-skill p em {
    font-size: 25px;
  }

  .sinlge-skill p {
    font-size: 16px;
  }

  .team-bar .first-one-arrow {
    width: 2%;
  }

  .team-bar .first-arrow {
    width: 18%;
  }

  .team-bar .second-arrow {
    width: 24%;
  }

  .team-bar .third-arrow {
    width: 15%;
  }

  .team-bar .fourth-arrow {
    width: 20%;
  }

  .blog .blog-item .entry-meta > span a{
    font-size: 10px;
  }
}

/* xs */
@media (max-width: 767px) {
  .container > .navbar-header, .container > .navbar-collapse{
    margin-left: 0;
  }

  .top-number{
    font-size: 14px;
  }

  input.search-form:hover {
    width: 120px;
  }

  .navbar-nav > li {
    padding-bottom: 0;
  }

  #main-slider .carousel h1 {
    font-size: 25px;
  }

  #main-slider .carousel h2 {
    font-size: 16px;
  }

  #mini-slider .carousel h1 {
    font-size: 25px;
  }

  #mini-slider .carousel h2 {
    font-size: 16px;
  }

  .feature-wrap h2, 
  .single-services h2 {
    font-size: 18px;
  }

  .feature-wrap h3, 
  .single-services h3{
    font-size: 14px;
  }


  .media.accordion-inner .pull-left, 
  .media.accordion-inner .media-body{
    clear: both;
  }

  .accordion-inner h4 {
    margin-top: 10px;
  }

  .tab-wrap .media .pull-left{
    clear: both;
    width: 100%;
  }

  .tab-wrap .media .media-body{
    clear: both;
  }

  .nav-tabs > li.active > a:after{
    display: none;
  }

  #footer .col-sm-6{
      text-align:center;
  }

  #footer .col-sm-12{
    text-align:center;
}
  
   #footer .pull-right{
      float: none !important;
  }

  .sinlge-skill {
    margin: 0 auto;
    margin-top: 30px;
    margin-bottom: 30px;
  }

  .team .single-profile-top, 
  .team .single-profile-bottom {
    margin-bottom: 30px;
  }

  .clients-area {
    padding: 60px 0;
  }

  .clients-area h1 {
    font-size: 25px;
  }

  .portfolio-item, 
  #recent-works .col-xs-12.col-sm-4.col-md-3{
    padding:0 15px;
  }

  ul.social_icons li{
    margin-right: 0;
  }

  .blog .blog-item .entry-meta{
    margin-bottom: 20px;
  }

  .blog .blog-item .blog-content h3 {
    margin-bottom: 20px;
  }

  .post_reply_comments {
    padding-left: 20px;
  }
    

}

/* galaxy z fold 5 Portrait */
@media (max-width: 430px) {
  .navbar-brand img{
    padding-top: 0px;
    }

  .nav-img img{
    margin-top: 0px;
  }

  body > section{
    padding: 15px 0px 10px 10px;
  }

  #main-slider .carousel .item{
    height: 200px;
  }

 

  .right h2{
    font-size: 25px;
  }

  .right p{
    font-size: 7px;
  }
  #main-slider .carousel-indicators .active{
    width: 10px;
    height: 10px;
  }
  #main-slider .carousel-indicators .active:after{
    width: 14px;
    height: 14px;
  }
  #main-slider .carousel-indicators li{
    width: 10px;
    height: 10px;
  }

  #main-slider .carousel-indicators li:after{
    width: 14px;
    height: 14px;
  }

  .carousel-indicators{
    bottom: -5px;
  }


  body{
    max-width: 100%;
  }

/* history */

 
#history .row img{
  padding-top: 5px;
  width: 105%;
  height: 140px;
  border-radius: 20px;
  padding-left: 10px;
}

  #history .right {
    padding-right: 5px;
  }

  .right h2 {
    font-size: 15px;
    margin-bottom: 10px;
  }
  
  .right p {
    font-size: 6px;
  }
  
/* visi-misi */

  #feature p {
    font-size: 8px;
  }

  #feature .container .row{
    padding-bottom: 10px;
  }

  .visi-misi{
    margin-bottom: 0px;
  }
  .center h2{
    font-size: 15px;
    margin-bottom: 0px;
  }

  .visi-misi h3{
    font-size: 12px;
    margin-bottom: 0px;
    margin-top: 0px;
  }

  .visi-misi p{
    font-size: 8px;
  }

  .flex-container img{
    width: 100%;
  }
  
  .col-lg-3.col-sm-3.py-3{
    width: 24%;
    padding-right: 0px;
    padding-left: 10px;
  }

  .misi-box{
    width: 100%;
    padding-top: 0px;
    border: 1px solid;
  }

  .misi-box h2{
    font-size: 8px;
  }
  
  .misi-box p{
    padding-top: 0px;
  }

 

  /* team */
  #about-us2{
    padding-bottom: 150px;
  }

  .team .center{
    padding-bottom: 10px;
  }

  .team .row {
    padding-top: 10px;
    max-width: 100%;
    margin-left: -10px;
    margin-right: -20px;
  }
  .col-md-4.col-sm-6{
    /* padding-left: 40px;
    padding-right: 0px; */
    width: 50%;
  }
  
  .team p{
    font-size: 8px;
    line-height: 10px;
    padding: 5px 0 0 0;
    margin: 0px;
  }

  .team h4 {
    padding-top: 0px;
    font-size: 10px;
    line-height: 1;
    margin-top: 5px;
    margin-bottom: 5px;
  }

  .team h5 {
    font-size: 8px;
    line-height: 1;
    margin-top: 5px;
    margin-bottom: 5px;
  }

  .media-body{
    overflow: visible;
  }

  .media>.pull-left {
    margin-right: 0px;
  }

  .media img {
    width: 100%;
    padding-bottom: 10px;
  }

  /* activity */

  .activity-content .center {
    padding-top: 20px !important;
    padding-left: 0px !important;
  }

  .activity-content .center h2 {
    padding-bottom: 10px;
  }

 

  #mini-slider {
    margin-top: 2vw;
    height: 23vw !important;
    border-radius: 20px;
  }

  #mini-slider .carousel .item.active {
    
    height: 22vw !important;
  }

  #mini-slider .prev, #mini-slider .next {
    overflow: visible;
  }

  #mini-slider .prev, #mini-slider .next{
    top: 65%;
    height: 25px;
    width: 12px;
  }

  .fa-chevron-left{
    display: flex;
    height: 27px;
    align-items: center;
    padding-left: 2px;
    font-size: 10px;
  }
  .fa-chevron-right{
    display: flex;
    height: 27px;
    align-items: center;
    padding-left: 3px;
    font-size: 10px;
  }

  /* transaction */

  #transaction{
    padding-bottom: 170px;
  }
  .transaction-content .center {
    padding-top: 20px;
  }

  #transaction-slider{
    margin-top: 15px;
    height: 23vw !important;
    border-radius: 20px;
  }
  #transaction-slider .carousel .item.active {
    height: 22vw !important;
  }

  #transaction-slider .prev, #transaction-slider .next {
    overflow: visible;
  }

  #transaction-slider .prev, #transaction-slider .next{
    top: 65%;
    height: 25px;
    width: 12px;
  }

  #transaction-slider img {
    width: 100%;
  }

  /* footer */

  #footer {
    z-index: 5;
    padding-top: 30px;
    padding-bottom: 30px;
    color: #fff;
    background: #2e2e2e;
    position: fixed;
    /* left:0px; */
    bottom:0px;
    /* height:30px; */
    width: 100%;
  }

  /* product */
  #portfolio{
    padding-top: 30px !important;
    padding-bottom: 0px !important;
    padding-left: 0px;
  }

  .flex-container1{
    padding-right: 10px;
    padding-left: 10px;
  }
  .flex-container1 > div {
    margin: 0;
    padding: 5px;
    font-size: 30px;
  }

  .flex-container1 {
    flex-wrap: wrap;
  }

  .lead {
    font-size: 10px;
    padding-top: 10px;
    padding-left: 15px;
    padding-right: 15px;
  }

  .rokok h3 {
    font-weight: 600;
    font-size: 15px;
    line-height: 1;
    padding-bottom: 30px;
    height: 20px;
  }
  .bawah{
  padding-bottom: 170px!important;
  }

 /* contact-us */
  .gmap-area{
    padding: 25px 0;
  }
 .map-content{
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    flex-direction: column;
 }
 #contact-info{
  padding-top: 30px !important;
  padding-bottom: 170px !important;
 }
 #contact-info h2{
    font-size: 20px;
 }
 #contact-info h5{
  font-size: 15px;
 }
 #contact-info p{
  font-size: 10px;
  display: flex;
  align-items: center;
 }
}

@media (max-width: 1024px){
/* header */
.navbar-brand{
padding-top: 0px;
}
  /* visi-misi */
.flex-container img {
    width: 100%;
}

  /* aktifitas */
#mini-slider {
  border-radius: 0px;
  height: 22vw;
  border: 2px solid #c52d2f;
}
#mini-slider .carousel .item.active {
  height: 21vw;
}
.lead{
  font-size: 2vw;
}
.activity-content .center {
  padding-top: 3vw;
}
  /* transaksi */

#transaction-slider {
  height:22vw;
  border: 2px solid #c52d2f;
  border-radius: 0px;
}
#transaction .carousel .item.active {
  height: 21vw;
}

.transaction-content .center {
  padding-top: 25px;
}

/* product */
.flex-container1 {
  flex-wrap: wrap;
}

.flex-container1 img {
  width: 40%;
}

.flex-container1 > div {
  margin: 0px;
  padding: 0px;
}
#portfolio{
  padding-top: 40px;
  padding-bottom: 40px;
}

/* contact-us */
#contact-info{
  padding-top: 348px;
  padding-bottom: 335px;
}
  
}