@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");



.panel-galeri
{    
  /* box-shadow: 0 3px 20px rgba(0, 0, 0, 0.6); */
  border-radius: 10px;
  margin: 10px;
  /* background-color: #acacac; */
  padding: 0px;  
}
.panel-galeri img{
  display: inline-block;
  margin: 0 auto;
  max-width: 350px;
  max-height: 150px;      
}

/* galery css custom */
.demo-gallery{
  padding: 20px;
  height: 100%;
}
.demo-gallery > ul {
  margin-bottom: 0;
  margin-left: 0;
}
.demo-gallery > ul > li {
  float: left;
  /* margin-bottom: 20px; */
  /* width: 270px;
  height: 250px; */
}
.demo-gallery > ul > li a {
  /* border: 3px solid rgb(119, 117, 117); */
  border-radius:12px;
  display: block;
  overflow: hidden;
  position: relative;
  float: left;
}
.demo-gallery > ul > li a > img {
  -webkit-transition: -webkit-transform 0.15s ease 0s;
  -moz-transition: -moz-transform 0.15s ease 0s;
  -o-transition: -o-transform 0.15s ease 0s;
  transition: transform 0.15s ease 0s;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  height: 100%;
  width: 100%;
  /* max-height: 300px;
  max-width: 400px;
  padding: 15px; */
}
.demo-gallery > ul > li a:hover > img {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.5, 1.5, 1.5);
}


.content-7-2 p,
.content-7-2 h1 {
  margin: 0rem;
}

.content-7-2 .main {
  padding: 3rem;
}

.content-7-2 .text-section {
  margin-bottom: 3rem;
}


.content-7-2 .title-text {
    font: 600 3rem/1 "Asap", sans-serif;
    margin: 0.55rem;
    color: #285a7b;
}


.content-7-2 .caption-text {
  font-size: 0.875rem;
  line-height: 1.5rem;
  color: #9a9aa7;
}



/* hp */
@media (min-width: 256px) 
{

  .content-7-2 .main {
    padding: 0.5rem;
  }

  .content-7-2 .title-text {
    font: 400 2rem/1 "Asap", sans-serif;
    margin: 0.55rem;
    color: #285a7b;
  }

  .panel-galeri
  {    
    /* box-shadow: 0 3px 20px rgba(0, 0, 0, 0.6); */
    border-radius: 7px;
    margin: 5px;
    padding: 5px;     
  }


  /* galery css custom */
  .demo-gallery
  {
    /* padding: 10px; */
    margin: 0;

  }
  .demo-gallery > ul {        
    margin: 0;
  }
  .demo-gallery > ul > li {
      /* float: left;     */
      margin-bottom: 20px;            
      width: 100%;
      height: 100%;      
      /* padding-right: 0 auto; */
  }
  .demo-gallery > ul > li a {
      /* border: 3px solid #acacac; */
      border-radius:12px;
      display: block;
      margin: 0 auto;
      padding: 1rem;
      overflow: hidden;
      /* position: relative;     */
      /* float: right; */
  }
  .demo-gallery > ul > li a > iframe {
      -webkit-transition: -webkit-transform 0.15s ease 0s;
      -moz-transition: -moz-transform 0.15s ease 0s;
      -o-transition: -o-transform 0.15s ease 0s;
      transition: transform 0.15s ease 0s;
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
      height: 200px;
      width: 280px;      
      display: block;      
      margin: 0 auto;
  }
  .demo-gallery > ul > li a:hover > iframe {
      -webkit-transform: scale3d(1.1, 1.1, 1.1);
      transform: scale3d(1.5, 1.5, 1.5);
  }
}

/* hp */
@media (min-width: 410px) 
{
  .content-7-2 .main {
    padding: 0.5rem;
  }

  .content-7-2 .title-text {
    font: 400 2rem/1 "Asap", sans-serif;
    margin: 0.55rem;
    color: #285a7b;
  }

  .panel-galeri
  {    
    /* box-shadow: 0 3px 20px rgba(0, 0, 0, 0.6); */
    border-radius: 7px;
    margin: 5px;    
    padding: 5px;     
  }


  /* galery css custom */
  .demo-gallery
  {  
    margin: 0;
  }
  .demo-gallery > ul {        
    margin: 0;
  }
  .demo-gallery > ul > li {
      /* float: left;     */
      margin-bottom: 20px;            
      width: 100%;
      height: 100%;       
  }
  .demo-gallery > ul > li a {
      /* border: 3px solid #acacac; */
      border-radius:12px;
      display: block;
      margin: 0 auto;
      overflow: hidden;
      /* position: relative;     */
      /* float: right; */
  }
  .demo-gallery > ul > li a > iframe {
      -webkit-transition: -webkit-transform 0.15s ease 0s;
      -moz-transition: -moz-transform 0.15s ease 0s;
      -o-transition: -o-transform 0.15s ease 0s;
      transition: transform 0.15s ease 0s;
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
      display: block;
      margin: 0 auto;
      
      
  }
  .demo-gallery > ul > li a:hover > img {
      -webkit-transform: scale3d(1.1, 1.1, 1.1);
      transform: scale3d(1.5, 1.5, 1.5);
  }

}

/* tablet */
@media (min-width: 768px) 
{

  .content-7-2 .main {
    padding: 0.5rem;
  }

  .content-7-2 .title-text {
    font: 400 2rem/1 "Asap", sans-serif;
    margin: 0.55rem;
    color: #285a7b;
  }

  .panel-galeri
  {    
    /* box-shadow: 0 3px 20px rgba(0, 0, 0, 0.6); */
    border-radius: 7px;
    margin-top: 5px;
    padding: 0px;     
  }

  /* galery css custom */
  .demo-gallery
  {
    padding: 0px;

  }
  .demo-gallery > ul {
    margin-left: 0;
  }
  .demo-gallery > ul > li {
      /* float: left;            */
      width: 50%;
      height: 100%;
      /* padding-right: 65px;    */         
  }
  .demo-gallery > ul > li a {
      /* border: 3px solid #acacac; */
      border-radius:12px;
      display: block;
      overflow: hidden;
      position: relative;    
      /* float: left; */
  }
  .demo-gallery > ul > li a > iframe {
      -webkit-transition: -webkit-transform 0.15s ease 0s;
      -moz-transition: -moz-transform 0.15s ease 0s;
      -o-transition: -o-transform 0.15s ease 0s;
      transition: transform 0.15s ease 0s;
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
      height: 100%;
      width: 100%;      
      display: block;      
      margin: 0 auto;
  }
  .demo-gallery > ul > li a:hover > img {
      -webkit-transform: scale3d(1.1, 1.1, 1.1);
      transform: scale3d(1.5, 1.5, 1.5);
  }
}

/* desktop */
@media (min-width: 992px) 
{
  
  .content-7-2 .main {
    padding: 2rem 5rem 5rem 5rem;
  }

  .content-7-2 .title-text {
    font: 600 3rem/1 "Asap", sans-serif;
    margin: 0.55rem;
    color: #285a7b;
  }

  .panel-galeri
  {    
    /* box-shadow: 0 3px 20px rgba(0, 0, 0, 0.6); */
    border-radius: 10px;
    margin: 0px 10px;
    padding: 0px; 
    /* height: 500px;     */
  }


  /* galery css custom */
  .demo-gallery
  {
    padding: 20px;
    height: 100%;
  }
  .demo-gallery > ul {      
    margin-bottom: 0;
    margin-left: 0;
  }
  .demo-gallery > ul > li {
      float: left;    
      margin-bottom: 50px;        
      width: 33%;
      height: 100%;      
  }
  .demo-gallery > ul > li a {
      /* border: 3px solid #acacac; */
      border-radius:12px;

      overflow: hidden;
      position: relative;    
      float: left;
  }
  .demo-gallery > ul > li a > iframe {
      -webkit-transition: -webkit-transform 0.15s ease 0s;
      -moz-transition: -moz-transform 0.15s ease 0s;
      -o-transition: -o-transform 0.15s ease 0s;
      transition: transform 0.15s ease 0s;
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
      height: 180px;
      width: 300px;
      display: block;
      margin: 0 auto;
  }
  .demo-gallery > ul > li > video {
      height: 280px !important;
      width: 330px !important;
  }
  .demo-gallery > ul > li a:hover > img {
      -webkit-transform: scale3d(1.1, 1.1, 1.1);
      transform: scale3d(1.5, 1.5, 1.5);
  }
}