 html {
     scroll-behavior: smooth;
 }

 .foto1 {
     background: url('../images/UT/Arumi.jpg');
 }

 .foto2 {
     background: url('../images/UT/Devara.jpg');
 }

 .foto3 {
     background: url('../images/UT/Wiranto.png');
 }

 .foto4 {
     background: url('../images/UT/Zainul.jpg');
 }

 .carousel-inner .foto-profil {
     height: 200px;
     width: 200px;
     border-radius: 50%;
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center;
 }


 .copyright {
     margin: auto;
 }

 #footer iframe {
     height: 300px;
     width: 350px;
 }

 img.example-image {
     width: 90vw;
     margin: 1vw 5vw;
 }

 button.btn.btn-success.whatsapp {
     position: fixed;
     bottom: 2vh;
     right: 5vw;
     height: 50px;
     z-index: 99;
 }

 @media screen and (max-width: 1100px) {
     #footer iframe {
         height: 275px;
         width: 325px;
     }
 }

 @media screen and (max-width: 991px) {
     #footer iframe {
         height: 300px;
         width: 450px;
     }

 }

 @media screen and (max-width: 767px) {

     .navbar-brand {
         font-size: 22px !important;
     }

     video {
         width: 370px;
         height: 200px;
     }

     .pp-video {
         height: 300px;
     }



     button.btn.btn-light {
         font-size: 10px;
     }

     #footer iframe {
         display: none;
     }

     input#nama,
     input#email {
         font-size: 10px;
     }

 }

 @media screen and (max-width: 540px) {
     .testimonial p.mx-auto.mb-0 {
         font-size: 14px;
     }

     h3 {
         font-size: 16px;
     }

     .kalimat {
         display: block;
     }
 }

 @media screen and (max-width: 500px) {
     .kalimat {
         display: none;
     }

     video {
         width: 300px;
         height: 200px;
     }

     p.mx-auto.mb-0 {
         width: 80vw;
     }

 }

 @media screen and (max-width: 360px) {


     section.gallery.section-padding {
         padding: 28px 10px;
     }

     .section-padding,
     section#project,
     section#about {
         padding: 50px 0px;
     }
 }

 @media screen and (max-width: 270px) {
     video {
         width: 226px;
         height: 140px;
     }

     .p-2.m-3.bd-highlight.text-center.align-self-center {
         margin: 0 !important;
     }
 }