@import url("https://fonts.googleapis.com/css2?family=Montserrat: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");
body {
  font-family: "Montserrat", sans-serif;
}

@keyframes scaleAnimation {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@media (max-width: 575.98px) {
  @keyframes scaleAnimation {
    0% {
      transform: scale(0);
    }
    100% {
      transform: scale(1);
    }
  }
  #popup__menu {
    position: fixed;
    z-index: 9999;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #292C6D;
    animation-name: scaleAnimation;
    animation-duration: 1s;
    animation-fill-mode: both;
    display: none;
  }
  #popup__menu .container-fluid .row1 .col-sm-12 .menu__close {
    font-size: 2rem;
    color: #fff;
    text-decoration: none;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 {
    display: flex !important;
    flex-direction: row-reverse !important;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div1 {
    width: 50vw;
    height: 100vh;
    padding-top: 70vh;
    color: #fff;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div1 h2 {
    font-size: 1.2rem;
    color: #fff;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div1 ul li {
    margin-right: -0.5rem !important;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div1 ul li a img {
    width: 70%;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div2 {
    width: 50vw;
    height: 100vh;
    margin-top: -30%;
    padding-left: 2%;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div2 ul li a {
    font-size: 1.8rem;
    color: #fff;
    font-weight: 600;
  }
  #popup__menu__second {
    position: fixed;
    z-index: 9999;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #000;
    animation-name: scaleAnimation;
    animation-duration: 1s;
    animation-fill-mode: both;
    display: none;
  }
  #popup__menu__second .container-fluid .row1 .col-sm-12 .menu__close {
    font-size: 1.8rem;
    color: #fff;
    text-decoration: none;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 {
    display: flex !important;
    flex-direction: row-reverse !important;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div1 {
    width: 50vw;
    height: 100vh;
    padding-top: 70vh;
    color: #fff h2;
    color-font-size: 1.2rem;
    color-color: #fff;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div1 ul li {
    margin-right: -0.5rem !important;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div1 ul li a img {
    width: 70%;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div2 {
    width: 50vw;
    height: 100vh;
    margin-top: -30%;
    padding-left: 2%;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div2 ul li a {
    font-size: 1.8rem;
    color: #fff;
    font-weight: 600;
  }
  header {
    position: relative;
    z-index: 2;
    height: 40vh;
  }
  header .navbar {
    position: relative !important;
    margin-left: 5vw;
    margin-right: 5vw;
  }
  header .navbar a {
    margin: 2% 0;
  }
  header .navbar a img {
    width: 60%;
  }
  header .navbar .collapse {
    display: block !important;
    color: #fff;
  }
  header .navbar .collapse .navbar-nav {
    display: flex;
    flex-direction: column-reverse;
    text-align: right;
    margin-top: -16%;
    width: 50%;
  }
  header .navbar .collapse .navbar-nav .nav-item {
    margin-left: 2vw;
  }
  header .navbar .collapse .navbar-nav .nav-item a {
    font-size: 1.2rem;
    color: #fff;
  }
  header .navbar .collapse .navbar-nav .nav-item .nav-link-second {
    font-size: 1rem;
    color: #292C6D;
  }
  footer {
    margin-top: -80vh;
    min-height: 40vh;
    overflow: hidden;
    background-color: #292C6D;
  }
  footer .container-fluid {
    padding-top: 22vh;
    padding-bottom: 10vh;
    padding-left: 10vw;
    padding-right: 10vw;
  }
  footer .container-fluid .row1 {
    margin-bottom: 5%;
  }
  footer .container-fluid .row1 .col-sm-4 {
    margin: 0;
    padding: 0;
  }
  footer .container-fluid .row1 .col-sm-4 img {
    margin-top: 10%;
    width: 40%;
  }
  footer .container-fluid .row1 .col-sm-8 {
    margin-top: 2.5%;
  }
  footer .container-fluid .row1 .col-sm-8 ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    text-decoration: none;
  }
  footer .container-fluid .row1 .col-sm-8 ul li {
    margin-right: 5vw;
  }
  footer .container-fluid .row1 .col-sm-8 ul li a {
    color: #fff;
    font-size: 1.2rem;
    font-weight: 600;
  }
  footer .container-fluid .row1 .col-sm-8 ul li a:hover {
    text-decoration: none;
    font-weight: 800;
    font-style: italic;
  }
  footer .container-fluid .row2 .col1 h3 {
    font-size: 1.8rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col1 ul li a {
    color: #fff;
    font-size: 1.2rem;
  }
  footer .container-fluid .row2 .col1 ul li a:hover {
    text-decoration: none;
    font-weight: bold;
  }
  footer .container-fluid .row2 .col2 h3 {
    font-size: 1.8rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col2 ul li {
    font-size: 1.2rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col3 {
    padding: 0;
  }
  footer .container-fluid .row2 .col3 h3 {
    font-size: 1.8rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col3 ul li a {
    font-size: 1.2rem;
    color: #292C6D;
  }
  footer .container-fluid .row3 .col-sm-12 {
    color: #fff;
  }
  footer#footer__second {
    margin-top: 5%;
    min-height: 40vh;
    overflow: hidden;
    background-color: #292C6D;
  }
  footer#footer__second .container-fluid {
    padding-top: 10%;
    padding-bottom: 10vh;
    padding-left: 10vw;
    padding-right: 10vw;
  }
  footer#footer__second .container-fluid .row1 {
    margin-bottom: 5%;
  }
  footer#footer__second .container-fluid .row1 .col-sm-4 {
    margin: 0;
    padding: 0;
  }
  footer#footer__second .container-fluid .row1 .col-sm-4 img {
    margin-top: 10%;
    width: 40%;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 {
    margin-top: 2.5%;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    text-decoration: none;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul li {
    margin-right: 5vw;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul li a {
    color: #fff;
    font-size: 1.2rem;
    font-weight: 600;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul li a:hover {
    text-decoration: none;
    font-weight: 800;
    font-style: italic;
  }
  footer#footer__second .container-fluid .row2 .col1 h3 {
    font-size: 1.8rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col1 ul li a {
    color: #fff;
    font-size: 1.2rem;
  }
  footer#footer__second .container-fluid .row2 .col1 ul li a:hover {
    text-decoration: none;
    font-weight: bold;
  }
  footer#footer__second .container-fluid .row2 .col2 h3 {
    font-size: 1.8rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col2 ul li {
    font-size: 1.2rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col3 {
    padding: 0;
  }
  footer#footer__second .container-fluid .row2 .col3 h3 {
    font-size: 1.8rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col3 ul li a {
    font-size: 1.2rem;
    color: #292C6D;
  }
  footer#footer__second .container-fluid .row3 .col-sm-12 {
    color: #fff;
  }
  footer#footer__thirty {
    margin-top: 20vh;
    min-height: 40vh;
    overflow: hidden;
    background-color: #000;
  }
  footer#footer__thirty .container-fluid {
    padding-top: 10vh;
    padding-bottom: 10vh;
    padding-left: 10vw;
    padding-right: 10vw;
  }
  footer#footer__thirty .container-fluid .row1 {
    margin-bottom: 5%;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-4 {
    margin: 0;
    padding: 0;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-4 img {
    margin-top: 10%;
    width: 40%;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 {
    margin-top: 2.5%;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    text-decoration: none;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul li {
    margin-right: 5vw;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul li a {
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul li a:hover {
    text-decoration: none;
    font-weight: 800;
    font-style: italic;
  }
  footer#footer__thirty .container-fluid .row2 .col1 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col1 ul li a {
    color: #fff;
    font-size: 1rem;
  }
  footer#footer__thirty .container-fluid .row2 .col1 ul li a:hover {
    text-decoration: none;
    font-weight: bold;
  }
  footer#footer__thirty .container-fluid .row2 .col2 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col2 ul li {
    font-size: 1rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col3 {
    padding: 0;
  }
  footer#footer__thirty .container-fluid .row2 .col3 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col3 ul li a {
    font-size: 1rem;
    color: #292C6D;
  }
  footer#footer__thirty .container-fluid .row3 .col-sm-12 {
    color: #fff;
  }
  main #sosmed__side {
    display: none;
    position: fixed;
    width: 2.5vw;
    min-height: 20vh;
    top: 50%;
    left: 0;
    border-radius: 0 15px 15px 0;
    z-index: 999;
    background-color: #292C6D;
    text-align: center;
    overflow: hidden;
  }
  main #sosmed__side ul li {
    margin: 18% 0;
  }
  main #sosmed__side ul li a {
    font-size: 1.5rem;
    color: #FFFFFF;
  }
  main #sosmed__side ul li a img {
    width: 50%;
  }
  main #header__image {
    max-height: 100vh;
    margin-top: -40vh;
    overflow: hidden;
  }
  main #header__image .carousel {
    height: 100vh;
  }
  main #header__image .carousel .carousel-inner {
    height: 100vh;
  }
  main #header__image .carousel .carousel-inner .carousel-item {
    height: 100vh;
  }
  main #header__image .carousel .carousel-inner .carousel-item img {
    width: 100% !important;
    height: 100% !important;
    -o-object-fit: cover;
       object-fit: cover;
  }
  main #text__header__image {
    position: absolute;
    max-height: 100vh;
    width: 100%;
    top: 0;
    padding: 50vh 2vh 0;
  }
  main #text__header__image h1 {
    font-size: 4rem;
    color: #FFFFFF;
    font-weight: 600;
    line-height: 100%;
  }
  main #better__services {
    min-height: 100vh;
    overflow: hidden;
  }
  main #better__services .container .row .col-sm-12 h2 {
    margin-top: 10vh;
    font-size: 3.5rem;
    font-weight: 600;
    line-height: 100%;
  }
  main #better__services .list__services {
    margin-top: 10vh;
  }
  main #better__services .list__services .row .col-sm-6 h3 {
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 100%;
  }
  main #better__services .list__services .row .col-sm-6 p {
    font-size: 1.2rem;
    line-height: 100%;
  }
  main #better__services .list__services__ex .row .col-sm-12 {
    display: flex;
    flex-direction: row;
    padding: 0;
    margin: 0;
  }
  main #better__services .list__services__ex .row .col-sm-12 .text__ex {
    margin-top: 10%;
    margin-left: 5%;
    position: absolute;
    z-index: 2;
  }
  main #better__services .list__services__ex .row .col-sm-12 .text__ex h2 {
    font-size: 2rem;
    font-weight: 600;
    line-height: 100%;
  }
  main #better__services .list__services__ex .row .col-sm-12 .image__ex {
    position: relative;
    margin-top: 5%;
    margin-left: 10%;
    width: 100%;
    height: 30vh;
    border-radius: 50px 0px 0px 50px;
    overflow: hidden;
  }
  main #better__services .list__services__ex .row .col-sm-12 .image__ex img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
  }
  main #better__services .list__services__bottom {
    height: 45vh;
    width: 100%;
    margin-top: 10vh;
  }
  main #better__services .list__services__bottom .row .col-sm-12 p {
    font-size: 1.2rem;
    line-height: 100%;
  }
  main #what__todo {
    min-height: 100vh;
    padding: 15% 5%;
    overflow: hidden;
    background-color: #292C6D;
  }
  main #what__todo .container-fluid .row .col-sm-6 {
    padding-left: 5vw;
  }
  main #what__todo .container-fluid .row .col-sm-6 .img__slide__todo {
    position: relative;
    width: 100%;
    height: 60vh;
    border-radius: 45px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
  }
  main #what__todo .container-fluid .row .col-sm-6 .img__slide__todo img {
    -o-object-fit: cover;
       object-fit: cover;
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
  }
  main #what__todo .container-fluid .row .col-sm-6 .img__slide__todo img.active {
    opacity: 1;
  }
  main #what__todo .container-fluid .row .col-sm-6 h2 {
    font-size: 1.8rem;
    font-weight: 600;
    color: #FFFFFF;
  }
  main #what__todo .container-fluid .row .col-sm-6 p {
    margin-top: 5%;
    font-size: 1.2rem;
    line-height: 100%;
    color: #FFFFFF;
  }
  main #what__todo .container-fluid .row .col-sm-6 .btn__lets__talk {
    font-size: 0.9rem;
    min-width: 8vw;
    min-height: 5vh;
    margin-top: 10vh;
    border-color: #FFFFFF;
    color: #FFFFFF;
    border-radius: 5px;
  }
  main #what__todo .container-fluid .row .col-sm-6 .btn__lets__talk:hover {
    background-color: #FFFFFF;
    color: #292C6D;
  }
  main #special {
    min-height: 100vh;
    overflow: hidden;
  }
  main #special .container .row1 .col-sm-12 {
    margin-top: 10vh;
    margin-bottom: 5vh;
  }
  main #special .container .row1 .col-sm-12 h2 {
    max-width: 50%;
    font-size: 2rem;
    font-weight: 600;
  }
  main #special .container .row1 .col-sm-12 p {
    padding-left: 5%;
    font-size: 1.2rem;
  }
  main #special .container .row2 .col2 {
    margin: 0;
    padding: 0 0 0 2%;
  }
  main #special .container .row2 .col2 .mycard {
    position: relative;
    margin-bottom: 4%;
    margin-left: 4%;
    margin-right: 0;
    padding-right: 0;
    width: 40vw;
    height: 18vh;
    border-radius: 20px;
    overflow: hidden;
  }
  main #special .container .row2 .col2 .mycard img {
    width: 100%;
    height: 100%;
    transition: filter 0.3s;
  }
  main #special .container .row2 .col2 .mycard:hover img {
    filter: blur(3px);
  }
  main #special .container .row2 .col2 .mycard:hover .mycard__text {
    opacity: 1;
  }
  main #special .container .row2 .col2 .mycard .mycard__text {
    position: absolute;
    top: 0;
    width: 40vw;
    height: 18vh;
    line-height: 18vh;
    text-align: center;
    opacity: 0;
    transition: opacity 0.3s;
  }
  main #special .container .row2 .col2 .mycard .mycard__text .btn-thirty {
    display: inline-block;
    width: 110%;
    padding: 10px 20px;
    background-color: #fff;
    color: #000;
    text-decoration: none;
  }
  main #special__slides {
    min-height: 100vh;
    overflow: hidden;
  }
  main #special__slides .container .row .col-sm-12 {
    margin-top: 10%;
    border-radius: 30px;
  }
  main #header__image__page {
    height: 100vh;
    margin-top: -40vh;
    overflow: hidden;
  }
  main #header__image__page .container-fluid .row .col-sm-12 {
    margin: 0;
    padding: 0;
  }
  main #header__image__page .container-fluid .row .col-sm-12 .container__image {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #header__image__page .container-fluid .row .col-sm-12 .container__image img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
  }
  main #text__header__image__page {
    position: absolute;
    max-height: 100vh;
    width: 100%;
    top: 0;
    padding: 90% 2% 2% 2%;
  }
  main #text__header__image__page h1 {
    width: 50%;
    font-size: 2rem;
    color: #292C6D;
    font-weight: 600;
    line-height: 100%;
  }
  main #about__description {
    padding-top: 10%;
  }
  main #about__description .container .row .col-sm-12 p {
    font-size: 1.2rem;
  }
  main #about__wwd {
    padding-top: 5%;
  }
  main #about__wwd .container .row .col-sm-12 h2 {
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #about__wwd .container .row .col-sm-12 p {
    font-size: 1.2rem;
  }
  main #about__hwdi {
    padding-top: 5%;
  }
  main #about__hwdi .container .row .col-sm-12 h2 {
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #about__hwdi .container .row .col-sm-12 p {
    font-size: 1.2rem;
  }
  main #about__special {
    padding-top: 5%;
  }
  main #about__special .container .row .col-sm-4 .container__image {
    width: 100%;
    height: 20vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #about__special .container .row .col-sm-4 .container__image img {
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  main #about__special .container .row .col-sm-4 h3 {
    font-size: 1.5rem;
    color: #292C6D;
  }
  main #about__special .container .row .col-sm-4 p {
    font-size: 1.2rem;
  }
  main #about__awards {
    padding-top: 5%;
  }
  main #about__awards .container .row .col-sm-12 h2 {
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #about__organization {
    margin-top: 20%;
    min-height: 40vh;
    padding-top: 10%;
  }
  main #about__organization .container .row1 .col-sm-12 h2 {
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #about__organization .container .row2 .col-sm-3 .container__image {
    width: 100%;
    height: 30vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #about__organization .container .row2 .col-sm-3 .container__image img {
    width: 60%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  main #about__organization .container .row2 .col-sm-9 p {
    font-size: 1.2rem;
  }
  main #about__organization .container .row2 .col-sm-9 a {
    text-decoration: none;
    font-size: 1.2rem;
    color: #292C6D;
  }
  main #header__text__only {
    min-height: 100vh;
    margin-top: -40vh;
    overflow: hidden;
  }
  main #header__text__only .container-fluid {
    margin: 0;
    padding: 0;
  }
  main #header__text__only .container-fluid .row .col-sm-12 h2 {
    width: 60%;
    padding-top: 50%;
    padding-left: 10%;
    font-size: 2rem;
    color: #292C6D;
  }
  main #header__text__only .container-fluid .row .col-sm-12 p {
    width: 90%;
    padding-left: 10%;
    padding-top: 5%;
    font-size: 1.2rem;
  }
  main #services__card {
    min-height: 100vh;
  }
  main #services__card .container-fluid .row1 .col-sm-12 {
    padding: 5% 5%;
  }
  main #services__card .container-fluid .row1 .col-sm-12 h2 {
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #services__card .container-fluid .row2 {
    padding: 0 5%;
  }
  main #services__card .container-fluid .row2 .col-sm-4 {
    margin-bottom: 5%;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services {
    width: 100%;
    min-height: 70vh;
    padding: 20%;
    border-radius: 20px;
    overflow: hidden;
    background-color: #F6F6F6;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services .container__image {
    position: relative;
    width: 100%;
    height: 20vh;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services .container__image img {
    -o-object-fit: cover;
       object-fit: cover;
    max-width: 100%;
    max-height: 100%;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services p {
    font-size: 1.2rem;
  }
  main #contact {
    min-height: 130vh;
    padding: 15% 5%;
  }
  main #contact .container-fluid .row .col1 {
    padding-right: 5%;
  }
  main #contact .container-fluid .row .col1 h2 {
    font-size: 1.8rem;
  }
  main #contact .container-fluid .row .col1 p {
    font-size: 1.2rem;
  }
  main #contact .container-fluid .row .col1 h4 {
    font-size: 1.5;
  }
  main #contact .container-fluid .row .col1 ul li a {
    text-decoration: none;
    color: #000;
    font-size: 1.2rem;
  }
  main #contact .container-fluid .row .col2 {
    padding-top: 5%;
  }
  main #contact .container-fluid .row .col2 .form-group .form-control {
    border-top: none;
    border-left: none;
    border-right: none;
  }
  main #contact .container-fluid .row .col2 .form-group .btn-send {
    width: 20vw;
    height: 7vh;
    font-size: 1.2rem;
    color: #000;
    background-color: #fff;
  }
  main #family {
    min-height: 100vh;
    margin-top: -40vh;
    padding: 50% 0;
  }
  main #family .container-fluid {
    margin: 0;
    padding: 0;
  }
  main #family .container-fluid .row1 .col-sm-12 {
    padding: 5% 10%;
  }
  main #family .container-fluid .row1 .col-sm-12 h2 {
    width: 30%;
    font-size: 2rem;
    color: #292C6D;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan {
    min-height: 40vh;
    width: 100%;
    padding: 10%;
    background-color: #292C6D;
    color: #fff;
    overflow: hidden;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan .title {
    font-size: 1.5rem;
    font-weight: 600;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan .subtitle {
    font-size: 1.3rem;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan .desc {
    font-size: 1.2rem;
    margin-top: 2%;
  }
  main #family .container-fluid .row2 .col-sm-8 .card-deck {
    padding-top: 10%;
    padding-bottom: 10%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #family .container-fluid .row2 .col-sm-8 .card-deck .card {
    max-width: 80vw;
    cursor: pointer;
  }
  main #family .container-fluid .row2 .col-sm-8 .card-deck .card .card-image {
    width: 100%;
    height: 55vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #family .container-fluid .row2 .col-sm-8 .card-deck .card .card-image img {
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  main #header__values {
    min-height: 100vh;
    margin-top: -40vh;
    overflow: hidden;
    background-color: #292C6D;
    padding: 40% 2%;
  }
  main #header__values .container-fluid .row .col-sm-12 h2 {
    font-size: 4rem;
    color: #fff;
  }
  main #header__values .container-fluid .row .col-sm-12 p {
    font-size: 1.2rem;
    color: #fff;
  }
  main #section__value1 {
    min-height: 70vh;
    padding: 5%;
  }
  main #section__value1 .container .row .col-sm-12 {
    padding: 2% 0;
  }
  main #section__value1 .container .row .col-sm-12 .row .col-sm-3 h3 {
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #section__value1 .container .row .col-sm-12 .row .col-sm-9 p {
    font-size: 1.2rem;
  }
  main #garis__pletan {
    display: none;
    margin-top: -45%;
    margin-bottom: 10%;
    min-height: 70vh;
    width: 100%;
    overflow: hidden;
  }
  main #garis__pletan .container-fluid {
    margin: 0;
    padding: 0;
  }
  main #garis__pletan .container-fluid .row .col-sm-12 {
    display: flex;
    flex-direction: column;
    align-items: end;
  }
  main #garis__pletan .container-fluid .row .col-sm-12 .garis__plet {
    margin: 5% 0;
    width: 200px;
    height: 2px;
    background-color: #000;
  }
  main #section__value2 {
    min-height: 50vh;
    padding: 5%;
    overflow: hidden;
  }
  main #section__value2 .container .row .col-sm-12 h3 {
    margin-bottom: 5%;
    width: 50%;
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #section__value2 .container .row .col-sm-12 p {
    padding-left: 30%;
    font-size: 1.2rem;
  }
  main #header__career {
    min-height: 100vh;
    margin-top: -40vh;
    overflow: hidden;
    padding: 70% 5%;
    border-bottom: 1px solid #000;
  }
  main #header__career .container-fluid .row .col-sm-12 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #header__career .container-fluid .row .col-sm-12 p {
    font-size: 1.2rem;
    color: #292C6D;
  }
  main #section__careers {
    min-height: 100vh;
    padding: 10% 5%;
  }
  main #section__careers .container-fluid .row1 {
    padding: 5% 2%;
  }
  main #section__careers .container-fluid .row1 .col-sm-4 h3 {
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #section__careers .container-fluid .row1 .col-sm-8 {
    font-size: 1.2rem;
  }
  main #section__careers .container-fluid .row2 {
    padding: 2%;
    border-top: 1px solid #000;
  }
  main #section__careers .container-fluid .row2 .col-sm-4 h2 {
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #section__careers .container-fluid .row2 .col-sm-6 p {
    font-size: 1.2rem;
  }
  main #section__careers .container-fluid .row2 .col-sm-6 .btn-primary {
    margin-left: 80%;
    background-color: #292C6D;
  }
  main #header__podcast {
    min-height: 100vh;
    margin-top: -40vh;
    overflow: hidden;
  }
  main #header__podcast .container-fluid .row .col-sm-12 {
    margin: 0;
    padding: 0;
  }
  main #header__podcast .container-fluid .row .col-sm-12 .container__image {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #header__podcast .container-fluid .row .col-sm-12 .container__image img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
  }
  main #text__header__podcast {
    position: absolute;
    max-height: 100vh;
    width: 100%;
    top: 0;
    padding: 60% 2%;
  }
  main #text__header__podcast h1 {
    width: 70%;
    font-size: 2rem;
    color: #fff;
    font-weight: 600;
    line-height: 100%;
  }
  main #text__header__podcast p {
    width: 100%;
    font-size: 1.2rem;
    color: #fff;
  }
  main #text__header__podcast .btn-listen {
    background-color: rgba(255, 255, 255, 0.5);
    color: #ffffff;
    display: inline-block;
    padding: 10px 20px;
    text-decoration: none;
  }
  main #text__header__podcast .btn-listen img {
    vertical-align: middle;
    margin-left: 5px;
  }
  main #text__header__podcast .btn-listen:hover {
    background-color: rgba(255, 255, 255, 0.8);
  }
  main #podcast__section1 {
    min-height: 50vh;
    padding: 10% 2%;
    overflow: hidden;
  }
  main #podcast__section1 .container-fluid .row .col1 h3 {
    width: 30%;
    color: #fff;
    font-size: 1.8rem;
  }
  main #podcast__section1 .container-fluid .row .col2 .row2 .col-sm-12 ul {
    display: inline-block;
    margin-right: 5px;
  }
  main #podcast__section1 .container-fluid .row .col2 .row2 .col-sm-12 ul li .line__kntl {
    width: 5vw;
    height: 1px;
    background-color: #fff;
  }
  main #podcast__section1 .container-fluid .row .col2 .row2 .col-sm-12 ul li a {
    font-size: 1.2rem;
    color: #fff;
  }
  main #podcast__section2 {
    min-height: 100vh;
    margin-bottom: 5%;
  }
  main #podcast__section2 .container .row1 .col-sm-12 h3 {
    font-size: 1.8rem;
    color: #fff;
  }
  main #podcast__section3 {
    min-height: 40vh;
    padding: 5% 0;
  }
  main #podcast__section3 .container .row .col1 h3 {
    font-size: 1.8rem;
    color: #fff;
  }
  main #podcast__section3 .container .row .col1 p {
    font-size: 1.2rem;
    color: #fff;
  }
  main #podcast__section3 .container .row .col2 {
    padding: auto;
  }
  main #podcast__section3 .container .row .col2 .aiueo1 .m-auto {
    margin-left: 2% !important;
  }
}
@media (min-width: 576px) and (max-width: 767.98px) {
  @keyframes scaleAnimation {
    0% {
      transform: scale(0);
    }
    100% {
      transform: scale(1);
    }
  }
  #popup__menu {
    position: fixed;
    z-index: 9999;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #292C6D;
    animation-name: scaleAnimation;
    animation-duration: 1s;
    animation-fill-mode: both;
    display: none;
  }
  #popup__menu .container-fluid .row1 .col-sm-12 .menu__close {
    font-size: 2rem;
    color: #fff;
    text-decoration: none;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 {
    display: flex !important;
    flex-direction: row-reverse !important;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div1 {
    width: 50vw;
    height: 100vh;
    padding-top: 70vh;
    color: #fff;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div1 h2 {
    font-size: 1.2rem;
    color: #fff;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div1 ul li {
    margin-right: -0.5rem !important;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div1 ul li a img {
    width: 70%;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div2 {
    width: 50vw;
    height: 100vh;
    margin-top: -30%;
    padding-left: 2%;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div2 ul li a {
    font-size: 1.8rem;
    color: #fff;
    font-weight: 600;
  }
  #popup__menu__second {
    position: fixed;
    z-index: 9999;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #000;
    animation-name: scaleAnimation;
    animation-duration: 1s;
    animation-fill-mode: both;
    display: none;
  }
  #popup__menu__second .container-fluid .row1 .col-sm-12 .menu__close {
    font-size: 2rem;
    color: #fff;
    text-decoration: none;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 {
    display: flex !important;
    flex-direction: row-reverse !important;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div1 {
    width: 50vw;
    height: 100vh;
    padding-top: 70vh;
    color: #fff;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div1 h2 {
    font-size: 1.2rem;
    color: #fff;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div1 ul li {
    margin-right: -0.5rem !important;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div1 ul li a img {
    width: 70%;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div2 {
    width: 50vw;
    height: 100vh;
    margin-top: -30%;
    padding-left: 2%;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div2 ul li a {
    font-size: 1.8rem;
    color: #fff;
    font-weight: 600;
  }
  header {
    position: relative;
    z-index: 2;
    height: 40vh;
  }
  header .navbar {
    position: relative !important;
    margin-left: 5vw;
    margin-right: 5vw;
  }
  header .navbar a {
    margin: 2% 0;
  }
  header .navbar a img {
    width: 60%;
  }
  header .navbar .collapse {
    display: block !important;
    color: #fff;
  }
  header .navbar .collapse .navbar-nav {
    display: flex;
    flex-direction: column-reverse;
    text-align: right;
    margin-top: -16%;
    width: 50%;
  }
  header .navbar .collapse .navbar-nav .nav-item {
    margin-left: 2vw;
  }
  header .navbar .collapse .navbar-nav .nav-item a {
    font-size: 1.2rem;
    color: #fff;
  }
  header .navbar .collapse .navbar-nav .nav-item .nav-link-second {
    font-size: 1rem;
    color: #292C6D;
  }
  footer {
    margin-top: -80vh;
    min-height: 40vh;
    overflow: hidden;
    background-color: #292C6D;
  }
  footer .container-fluid {
    padding-top: 22vh;
    padding-bottom: 10vh;
    padding-left: 10vw;
    padding-right: 10vw;
  }
  footer .container-fluid .row1 {
    margin-bottom: 5%;
  }
  footer .container-fluid .row1 .col-sm-4 {
    margin: 0;
    padding: 0;
  }
  footer .container-fluid .row1 .col-sm-4 img {
    margin-top: 10%;
    width: 40%;
  }
  footer .container-fluid .row1 .col-sm-8 {
    margin-top: 2.5%;
  }
  footer .container-fluid .row1 .col-sm-8 ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    text-decoration: none;
  }
  footer .container-fluid .row1 .col-sm-8 ul li {
    margin-right: 5vw;
  }
  footer .container-fluid .row1 .col-sm-8 ul li a {
    color: #fff;
    font-size: 1.2rem;
    font-weight: 600;
  }
  footer .container-fluid .row1 .col-sm-8 ul li a:hover {
    text-decoration: none;
    font-weight: 800;
    font-style: italic;
  }
  footer .container-fluid .row2 .col1 h3 {
    font-size: 1.8rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col1 ul li a {
    color: #fff;
    font-size: 1.2rem;
  }
  footer .container-fluid .row2 .col1 ul li a:hover {
    text-decoration: none;
    font-weight: bold;
  }
  footer .container-fluid .row2 .col2 h3 {
    font-size: 1.8rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col2 ul li {
    font-size: 1.2rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col3 {
    padding: 0;
  }
  footer .container-fluid .row2 .col3 h3 {
    font-size: 1.8rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col3 ul li a {
    font-size: 1.2rem;
    color: #292C6D;
  }
  footer .container-fluid .row3 .col-sm-12 {
    color: #fff;
  }
  footer#footer__second {
    margin-top: 5%;
    min-height: 40vh;
    overflow: hidden;
    background-color: #292C6D;
  }
  footer#footer__second .container-fluid {
    padding-top: 10%;
    padding-bottom: 10vh;
    padding-left: 10vw;
    padding-right: 10vw;
  }
  footer#footer__second .container-fluid .row1 {
    margin-bottom: 5%;
  }
  footer#footer__second .container-fluid .row1 .col-sm-4 {
    margin: 0;
    padding: 0;
  }
  footer#footer__second .container-fluid .row1 .col-sm-4 img {
    margin-top: 10%;
    width: 40%;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 {
    margin-top: 2.5%;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    text-decoration: none;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul li {
    margin-right: 5vw;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul li a {
    color: #fff;
    font-size: 1.2rem;
    font-weight: 600;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul li a:hover {
    text-decoration: none;
    font-weight: 800;
    font-style: italic;
  }
  footer#footer__second .container-fluid .row2 .col1 h3 {
    font-size: 1.8rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col1 ul li a {
    color: #fff;
    font-size: 1.2rem;
  }
  footer#footer__second .container-fluid .row2 .col1 ul li a:hover {
    text-decoration: none;
    font-weight: bold;
  }
  footer#footer__second .container-fluid .row2 .col2 h3 {
    font-size: 1.8rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col2 ul li {
    font-size: 1.2rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col3 {
    padding: 0;
  }
  footer#footer__second .container-fluid .row2 .col3 h3 {
    font-size: 1.8rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col3 ul li a {
    font-size: 1.2rem;
    color: #292C6D;
  }
  footer#footer__second .container-fluid .row3 .col-sm-12 {
    color: #fff;
  }
  footer#footer__thirty {
    margin-top: 20vh;
    min-height: 40vh;
    overflow: hidden;
    background-color: #000;
  }
  footer#footer__thirty .container-fluid {
    padding-top: 10vh;
    padding-bottom: 10vh;
    padding-left: 10vw;
    padding-right: 10vw;
  }
  footer#footer__thirty .container-fluid .row1 {
    margin-bottom: 5%;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-4 {
    margin: 0;
    padding: 0;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-4 img {
    margin-top: 10%;
    width: 40%;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 {
    margin-top: 2.5%;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    text-decoration: none;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul li {
    margin-right: 5vw;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul li a {
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul li a:hover {
    text-decoration: none;
    font-weight: 800;
    font-style: italic;
  }
  footer#footer__thirty .container-fluid .row2 .col1 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col1 ul li a {
    color: #fff;
    font-size: 1rem;
  }
  footer#footer__thirty .container-fluid .row2 .col1 ul li a:hover {
    text-decoration: none;
    font-weight: bold;
  }
  footer#footer__thirty .container-fluid .row2 .col2 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col2 ul li {
    font-size: 1rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col3 {
    padding: 0;
  }
  footer#footer__thirty .container-fluid .row2 .col3 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col3 ul li a {
    font-size: 1rem;
    color: #292C6D;
  }
  footer#footer__thirty .container-fluid .row3 .col-sm-12 {
    color: #fff;
  }
  main #sosmed__side {
    display: none;
    position: fixed;
    width: 2.5vw;
    min-height: 20vh;
    top: 50%;
    left: 0;
    border-radius: 0 15px 15px 0;
    z-index: 999;
    background-color: #292C6D;
    text-align: center;
    overflow: hidden;
  }
  main #sosmed__side ul li {
    margin: 18% 0;
  }
  main #sosmed__side ul li a {
    font-size: 1.5rem;
    color: #FFFFFF;
  }
  main #sosmed__side ul li a img {
    width: 50%;
  }
  main #header__image {
    max-height: 100vh;
    margin-top: -40vh;
    overflow: hidden;
  }
  main #header__image .carousel {
    height: 100vh;
  }
  main #header__image .carousel .carousel-inner {
    height: 100vh;
  }
  main #header__image .carousel .carousel-inner .carousel-item {
    height: 100vh;
  }
  main #header__image .carousel .carousel-inner .carousel-item img {
    width: 100% !important;
    height: 100% !important;
    -o-object-fit: cover;
       object-fit: cover;
  }
  main #text__header__image {
    position: absolute;
    max-height: 100vh;
    width: 100%;
    top: 0;
    padding: 50vh 2vh 0;
  }
  main #text__header__image h1 {
    font-size: 4rem;
    color: #FFFFFF;
    font-weight: 600;
    line-height: 100%;
  }
  main #better__services {
    min-height: 100vh;
    overflow: hidden;
  }
  main #better__services .container .row .col-sm-12 h2 {
    margin-top: 10vh;
    font-size: 3.5rem;
    font-weight: 600;
    line-height: 100%;
  }
  main #better__services .list__services {
    margin-top: 10vh;
  }
  main #better__services .list__services .row .col-sm-6 h3 {
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 100%;
  }
  main #better__services .list__services .row .col-sm-6 p {
    font-size: 1.2rem;
    line-height: 100%;
  }
  main #better__services .list__services__ex .row .col-sm-12 {
    display: flex;
    flex-direction: row;
    padding: 0;
    margin: 0;
  }
  main #better__services .list__services__ex .row .col-sm-12 .text__ex {
    margin-top: 10%;
    margin-left: 5%;
    position: absolute;
    z-index: 2;
  }
  main #better__services .list__services__ex .row .col-sm-12 .text__ex h2 {
    font-size: 2rem;
    font-weight: 600;
    line-height: 100%;
  }
  main #better__services .list__services__ex .row .col-sm-12 .image__ex {
    position: relative;
    margin-top: 5%;
    margin-left: 10%;
    width: 100%;
    height: 30vh;
    border-radius: 50px 0px 0px 50px;
    overflow: hidden;
  }
  main #better__services .list__services__ex .row .col-sm-12 .image__ex img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
  }
  main #better__services .list__services__bottom {
    height: 45vh;
    width: 100%;
    margin-top: 10vh;
  }
  main #better__services .list__services__bottom .row .col-sm-12 p {
    font-size: 1.2rem;
    line-height: 100%;
  }
  main #what__todo {
    min-height: 100vh;
    padding: 15% 5%;
    overflow: hidden;
    background-color: #292C6D;
  }
  main #what__todo .container-fluid .row .col-sm-6 {
    padding-left: 5vw;
  }
  main #what__todo .container-fluid .row .col-sm-6 .img__slide__todo {
    position: relative;
    width: 100%;
    height: 60vh;
    border-radius: 45px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
  }
  main #what__todo .container-fluid .row .col-sm-6 .img__slide__todo img {
    -o-object-fit: cover;
       object-fit: cover;
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
  }
  main #what__todo .container-fluid .row .col-sm-6 .img__slide__todo img.active {
    opacity: 1;
  }
  main #what__todo .container-fluid .row .col-sm-6 h2 {
    font-size: 1.8rem;
    font-weight: 600;
    color: #FFFFFF;
  }
  main #what__todo .container-fluid .row .col-sm-6 p {
    margin-top: 5%;
    font-size: 1.2rem;
    line-height: 100%;
    color: #FFFFFF;
  }
  main #what__todo .container-fluid .row .col-sm-6 .btn__lets__talk {
    font-size: 0.9rem;
    min-width: 8vw;
    min-height: 5vh;
    margin-top: 10vh;
    border-color: #FFFFFF;
    color: #FFFFFF;
    border-radius: 5px;
  }
  main #what__todo .container-fluid .row .col-sm-6 .btn__lets__talk:hover {
    background-color: #FFFFFF;
    color: #292C6D;
  }
  main #special {
    min-height: 100vh;
    overflow: hidden;
  }
  main #special .container .row1 .col-sm-12 {
    margin-top: 10vh;
    margin-bottom: 5vh;
  }
  main #special .container .row1 .col-sm-12 h2 {
    max-width: 50%;
    font-size: 2rem;
    font-weight: 600;
  }
  main #special .container .row1 .col-sm-12 p {
    padding-left: 5%;
    font-size: 1.2rem;
  }
  main #special .container .row2 .col2 {
    margin: 0;
    padding: 0 0 0 2%;
  }
  main #special .container .row2 .col2 .mycard {
    position: relative;
    margin-bottom: 4%;
    margin-left: 4%;
    margin-right: 0;
    padding-right: 0;
    width: 40vw;
    height: 18vh;
    border-radius: 20px;
    overflow: hidden;
  }
  main #special .container .row2 .col2 .mycard img {
    width: 100%;
    height: 100%;
    transition: filter 0.3s;
  }
  main #special .container .row2 .col2 .mycard:hover img {
    filter: blur(3px);
  }
  main #special .container .row2 .col2 .mycard:hover .mycard__text {
    opacity: 1;
  }
  main #special .container .row2 .col2 .mycard .mycard__text {
    position: absolute;
    top: 0;
    width: 40vw;
    height: 18vh;
    line-height: 18vh;
    text-align: center;
    opacity: 0;
    transition: opacity 0.3s;
  }
  main #special .container .row2 .col2 .mycard .mycard__text .btn-thirty {
    display: inline-block;
    width: 110%;
    padding: 10px 20px;
    background-color: #fff;
    color: #000;
    text-decoration: none;
  }
  main #special__slides {
    min-height: 100vh;
    overflow: hidden;
  }
  main #special__slides .container .row .col-sm-12 {
    margin-top: 10%;
    border-radius: 30px;
  }
  main #header__image__page {
    height: 100vh;
    margin-top: -40vh;
    overflow: hidden;
  }
  main #header__image__page .container-fluid .row .col-sm-12 {
    margin: 0;
    padding: 0;
  }
  main #header__image__page .container-fluid .row .col-sm-12 .container__image {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #header__image__page .container-fluid .row .col-sm-12 .container__image img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
  }
  main #text__header__image__page {
    position: absolute;
    max-height: 100vh;
    width: 100%;
    top: 0;
    padding: 90% 2% 2% 2%;
  }
  main #text__header__image__page h1 {
    width: 50%;
    font-size: 2rem;
    color: #292C6D;
    font-weight: 600;
    line-height: 100%;
  }
  main #about__description {
    padding-top: 10%;
  }
  main #about__description .container .row .col-sm-12 p {
    font-size: 1.2rem;
  }
  main #about__wwd {
    padding-top: 5%;
  }
  main #about__wwd .container .row .col-sm-12 h2 {
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #about__wwd .container .row .col-sm-12 p {
    font-size: 1.2rem;
  }
  main #about__hwdi {
    padding-top: 5%;
  }
  main #about__hwdi .container .row .col-sm-12 h2 {
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #about__hwdi .container .row .col-sm-12 p {
    font-size: 1.2rem;
  }
  main #about__special {
    padding-top: 5%;
  }
  main #about__special .container .row .col-sm-4 .container__image {
    width: 100%;
    height: 20vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #about__special .container .row .col-sm-4 .container__image img {
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  main #about__special .container .row .col-sm-4 h3 {
    font-size: 1.5rem;
    color: #292C6D;
  }
  main #about__special .container .row .col-sm-4 p {
    font-size: 1.2rem;
  }
  main #about__awards {
    padding-top: 5%;
  }
  main #about__awards .container .row .col-sm-12 h2 {
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #about__organization {
    margin-top: 20%;
    min-height: 40vh;
    padding-top: 10%;
  }
  main #about__organization .container .row1 .col-sm-12 h2 {
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #about__organization .container .row2 .col-sm-3 .container__image {
    width: 100%;
    height: 30vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #about__organization .container .row2 .col-sm-3 .container__image img {
    width: 60%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  main #about__organization .container .row2 .col-sm-9 p {
    font-size: 1.2rem;
  }
  main #about__organization .container .row2 .col-sm-9 a {
    text-decoration: none;
    font-size: 1.2rem;
    color: #292C6D;
  }
  main #header__text__only {
    min-height: 100vh;
    margin-top: -40vh;
    overflow: hidden;
  }
  main #header__text__only .container-fluid {
    margin: 0;
    padding: 0;
  }
  main #header__text__only .container-fluid .row .col-sm-12 h2 {
    width: 60%;
    padding-top: 50%;
    padding-left: 10%;
    font-size: 2rem;
    color: #292C6D;
  }
  main #header__text__only .container-fluid .row .col-sm-12 p {
    width: 90%;
    padding-left: 10%;
    padding-top: 5%;
    font-size: 1.2rem;
  }
  main #services__card {
    min-height: 100vh;
  }
  main #services__card .container-fluid .row1 .col-sm-12 {
    padding: 5% 5%;
  }
  main #services__card .container-fluid .row1 .col-sm-12 h2 {
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #services__card .container-fluid .row2 {
    padding: 0 5%;
  }
  main #services__card .container-fluid .row2 .col-sm-4 {
    margin-bottom: 5%;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services {
    width: 100%;
    min-height: 70vh;
    padding: 20%;
    border-radius: 20px;
    overflow: hidden;
    background-color: #F6F6F6;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services .container__image {
    position: relative;
    width: 100%;
    height: 20vh;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services .container__image img {
    -o-object-fit: cover;
       object-fit: cover;
    max-width: 100%;
    max-height: 100%;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services p {
    font-size: 1.2rem;
  }
  main #contact {
    min-height: 130vh;
    padding: 15% 5%;
  }
  main #contact .container-fluid .row .col1 {
    padding-right: 5%;
  }
  main #contact .container-fluid .row .col1 h2 {
    font-size: 1.8rem;
  }
  main #contact .container-fluid .row .col1 p {
    font-size: 1.2rem;
  }
  main #contact .container-fluid .row .col1 h4 {
    font-size: 1.5;
  }
  main #contact .container-fluid .row .col1 ul li a {
    text-decoration: none;
    color: #000;
    font-size: 1.2rem;
  }
  main #contact .container-fluid .row .col2 {
    padding-top: 5%;
  }
  main #contact .container-fluid .row .col2 .form-group .form-control {
    border-top: none;
    border-left: none;
    border-right: none;
  }
  main #contact .container-fluid .row .col2 .form-group .btn-send {
    width: 20vw;
    height: 7vh;
    font-size: 1.2rem;
    color: #000;
    background-color: #fff;
  }
  main #family {
    min-height: 100vh;
    margin-top: -40vh;
    padding: 50% 0;
  }
  main #family .container-fluid {
    margin: 0;
    padding: 0;
  }
  main #family .container-fluid .row1 .col-sm-12 {
    padding: 5% 10%;
  }
  main #family .container-fluid .row1 .col-sm-12 h2 {
    width: 30%;
    font-size: 2rem;
    color: #292C6D;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan {
    min-height: 40vh;
    width: 100%;
    padding: 10%;
    background-color: #292C6D;
    color: #fff;
    overflow: hidden;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan .title {
    font-size: 1.5rem;
    font-weight: 600;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan .subtitle {
    font-size: 1.3rem;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan .desc {
    font-size: 1.2rem;
    margin-top: 2%;
  }
  main #family .container-fluid .row2 .col-sm-8 .card-deck {
    padding-top: 10%;
    padding-bottom: 10%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #family .container-fluid .row2 .col-sm-8 .card-deck .card {
    max-width: 80vw;
    cursor: pointer;
  }
  main #family .container-fluid .row2 .col-sm-8 .card-deck .card .card-image {
    width: 100%;
    height: 55vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #family .container-fluid .row2 .col-sm-8 .card-deck .card .card-image img {
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  main #header__values {
    min-height: 100vh;
    margin-top: -40vh;
    overflow: hidden;
    background-color: #292C6D;
    padding: 40% 2%;
  }
  main #header__values .container-fluid .row .col-sm-12 h2 {
    font-size: 4rem;
    color: #fff;
  }
  main #header__values .container-fluid .row .col-sm-12 p {
    font-size: 1.2rem;
    color: #fff;
  }
  main #section__value1 {
    min-height: 70vh;
    padding: 5%;
  }
  main #section__value1 .container .row .col-sm-12 {
    padding: 2% 0;
  }
  main #section__value1 .container .row .col-sm-12 .row .col-sm-3 h3 {
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #section__value1 .container .row .col-sm-12 .row .col-sm-9 p {
    font-size: 1.2rem;
  }
  main #garis__pletan {
    display: none;
    margin-top: -45%;
    margin-bottom: 10%;
    min-height: 70vh;
    width: 100%;
    overflow: hidden;
  }
  main #garis__pletan .container-fluid {
    margin: 0;
    padding: 0;
  }
  main #garis__pletan .container-fluid .row .col-sm-12 {
    display: flex;
    flex-direction: column;
    align-items: end;
  }
  main #garis__pletan .container-fluid .row .col-sm-12 .garis__plet {
    margin: 5% 0;
    width: 200px;
    height: 2px;
    background-color: #000;
  }
  main #section__value2 {
    min-height: 50vh;
    padding: 5%;
    overflow: hidden;
  }
  main #section__value2 .container .row .col-sm-12 h3 {
    margin-bottom: 5%;
    width: 50%;
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #section__value2 .container .row .col-sm-12 p {
    padding-left: 30%;
    font-size: 1.2rem;
  }
  main #header__career {
    min-height: 100vh;
    margin-top: -40vh;
    overflow: hidden;
    padding: 70% 5%;
    border-bottom: 1px solid #000;
  }
  main #header__career .container-fluid .row .col-sm-12 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #header__career .container-fluid .row .col-sm-12 p {
    font-size: 1.2rem;
    color: #292C6D;
  }
  main #section__careers {
    min-height: 100vh;
    padding: 10% 5%;
  }
  main #section__careers .container-fluid .row1 {
    padding: 5% 2%;
  }
  main #section__careers .container-fluid .row1 .col-sm-4 h3 {
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #section__careers .container-fluid .row1 .col-sm-8 {
    font-size: 1.2rem;
  }
  main #section__careers .container-fluid .row2 {
    padding: 2%;
    border-top: 1px solid #000;
  }
  main #section__careers .container-fluid .row2 .col-sm-4 h2 {
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #section__careers .container-fluid .row2 .col-sm-6 p {
    font-size: 1.2rem;
  }
  main #section__careers .container-fluid .row2 .col-sm-6 .btn-primary {
    margin-left: 80%;
    background-color: #292C6D;
  }
  main #header__podcast {
    min-height: 100vh;
    margin-top: -40vh;
    overflow: hidden;
  }
  main #header__podcast .container-fluid .row .col-sm-12 {
    margin: 0;
    padding: 0;
  }
  main #header__podcast .container-fluid .row .col-sm-12 .container__image {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #header__podcast .container-fluid .row .col-sm-12 .container__image img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
  }
  main #text__header__podcast {
    position: absolute;
    max-height: 100vh;
    width: 100%;
    top: 0;
    padding: 60% 2%;
  }
  main #text__header__podcast h1 {
    width: 70%;
    font-size: 2rem;
    color: #fff;
    font-weight: 600;
    line-height: 100%;
  }
  main #text__header__podcast p {
    width: 100%;
    font-size: 1.2rem;
    color: #fff;
  }
  main #text__header__podcast .btn-listen {
    background-color: rgba(255, 255, 255, 0.5);
    color: #ffffff;
    display: inline-block;
    padding: 10px 20px;
    text-decoration: none;
  }
  main #text__header__podcast .btn-listen img {
    vertical-align: middle;
    margin-left: 5px;
  }
  main #text__header__podcast .btn-listen:hover {
    background-color: rgba(255, 255, 255, 0.8);
  }
  main #podcast__section1 {
    min-height: 50vh;
    padding: 10% 2%;
    overflow: hidden;
  }
  main #podcast__section1 .container-fluid .row .col1 h3 {
    width: 30%;
    color: #fff;
    font-size: 1.8rem;
  }
  main #podcast__section1 .container-fluid .row .col2 .row2 .col-sm-12 ul {
    display: inline-block;
    margin-right: 5px;
  }
  main #podcast__section1 .container-fluid .row .col2 .row2 .col-sm-12 ul li .line__kntl {
    width: 5vw;
    height: 1px;
    background-color: #fff;
  }
  main #podcast__section1 .container-fluid .row .col2 .row2 .col-sm-12 ul li a {
    font-size: 1.2rem;
    color: #fff;
  }
  main #podcast__section2 {
    min-height: 100vh;
    margin-bottom: 5%;
  }
  main #podcast__section2 .container .row1 .col-sm-12 h3 {
    font-size: 1.8rem;
    color: #fff;
  }
  main #podcast__section3 {
    min-height: 40vh;
    padding: 5% 0;
  }
  main #podcast__section3 .container .row .col1 h3 {
    font-size: 1.8rem;
    color: #fff;
  }
  main #podcast__section3 .container .row .col1 p {
    font-size: 1.2rem;
    color: #fff;
  }
  main #podcast__section3 .container .row .col2 {
    padding: auto;
  }
  main #podcast__section3 .container .row .col2 .aiueo1 .m-auto {
    margin-left: 2% !important;
  }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  #popup__menu {
    position: fixed;
    z-index: 9999;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #292C6D;
    animation-name: scaleAnimation;
    animation-duration: 1s;
    animation-fill-mode: both;
    display: none;
  }
  #popup__menu .container-fluid .row1 .col-sm-12 .menu__close {
    font-size: 2rem;
    color: #fff;
    text-decoration: none;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div1 {
    margin-top: auto;
    width: 50vw;
    height: 100vh;
    padding: 40% 5% 10% 5%;
    bottom: 0;
    color: #fff;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div1 h2 {
    font-size: 2rem;
    color: #fff;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div2 {
    width: 50vw;
    height: 100vh;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div2 ul li a {
    font-size: 3.5rem;
    color: #fff;
    font-weight: 600;
  }
  #popup__menu__second {
    position: fixed;
    z-index: 9999;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #000;
    animation-name: scaleAnimation;
    animation-duration: 1s;
    animation-fill-mode: both;
    display: none;
  }
  #popup__menu__second .container-fluid .row1 .col-sm-12 .menu__close {
    font-size: 2rem;
    color: #fff;
    text-decoration: none;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div1 {
    margin-top: auto;
    width: 50vw;
    height: 100vh;
    padding: 40% 5% 10% 5%;
    bottom: 0;
    color: #fff;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div1 h2 {
    font-size: 2rem;
    color: #fff;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div2 {
    width: 50vw;
    height: 100vh;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div2 ul li a {
    font-size: 3.5rem;
    color: #fff;
    font-weight: 600;
  }
  header {
    height: 10vh;
    position: relative;
    z-index: 2;
  }
  header .navbar {
    margin-left: 5vw;
    margin-right: 5vw;
  }
  header .navbar a {
    margin: 2% 0;
  }
  header .navbar a img {
    width: 100%;
  }
  header .navbar .collapse .navbar-nav .nav-item {
    margin-left: 2vw;
  }
  header .navbar .collapse .navbar-nav .nav-item a {
    font-size: 1rem;
    color: #fff;
  }
  header .navbar .collapse .navbar-nav .nav-item .nav-link-second {
    font-size: 1rem;
    color: #292C6D;
  }
  footer {
    margin-top: -50vh;
    min-height: 70vh;
    overflow: hidden;
    background-color: #292C6D;
  }
  footer .container-fluid {
    padding-top: 50vh;
    padding-bottom: 10vh;
    padding-left: 10vw;
    padding-right: 10vw;
  }
  footer .container-fluid .row1 {
    margin-bottom: 5%;
  }
  footer .container-fluid .row1 .col-sm-4 {
    margin: 0;
    padding: 0;
  }
  footer .container-fluid .row1 .col-sm-4 img {
    margin-top: 10%;
    width: 40%;
  }
  footer .container-fluid .row1 .col-sm-8 {
    margin-top: 2.5%;
  }
  footer .container-fluid .row1 .col-sm-8 ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    text-decoration: none;
  }
  footer .container-fluid .row1 .col-sm-8 ul li {
    margin-right: 5vw;
  }
  footer .container-fluid .row1 .col-sm-8 ul li a {
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
  }
  footer .container-fluid .row1 .col-sm-8 ul li a:hover {
    text-decoration: none;
    font-weight: 800;
    font-style: italic;
  }
  footer .container-fluid .row2 .col1 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col1 ul li a {
    color: #fff;
    font-size: 1rem;
  }
  footer .container-fluid .row2 .col1 ul li a:hover {
    text-decoration: none;
    font-weight: bold;
  }
  footer .container-fluid .row2 .col2 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col2 ul li {
    font-size: 1rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col3 {
    padding: 0;
  }
  footer .container-fluid .row2 .col3 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col3 ul li a {
    font-size: 1rem;
    color: #292C6D;
  }
  footer .container-fluid .row3 .col-sm-12 {
    color: #fff;
  }
  footer#footer__second {
    margin-top: 20vh;
    min-height: 40vh;
    overflow: hidden;
    background-color: #292C6D;
  }
  footer#footer__second .container-fluid {
    padding-top: 10vh;
    padding-bottom: 10vh;
    padding-left: 10vw;
    padding-right: 10vw;
  }
  footer#footer__second .container-fluid .row1 {
    margin-bottom: 5%;
  }
  footer#footer__second .container-fluid .row1 .col-sm-4 {
    margin: 0;
    padding: 0;
  }
  footer#footer__second .container-fluid .row1 .col-sm-4 img {
    margin-top: 10%;
    width: 40%;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 {
    margin-top: 2.5%;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    text-decoration: none;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul li {
    margin-right: 5vw;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul li a {
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul li a:hover {
    text-decoration: none;
    font-weight: 800;
    font-style: italic;
  }
  footer#footer__second .container-fluid .row2 .col1 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col1 ul li a {
    color: #fff;
    font-size: 1rem;
  }
  footer#footer__second .container-fluid .row2 .col1 ul li a:hover {
    text-decoration: none;
    font-weight: bold;
  }
  footer#footer__second .container-fluid .row2 .col2 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col2 ul li {
    font-size: 1rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col3 {
    padding: 0;
  }
  footer#footer__second .container-fluid .row2 .col3 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col3 ul li a {
    font-size: 1rem;
    color: #292C6D;
  }
  footer#footer__second .container-fluid .row3 .col-sm-12 {
    color: #fff;
  }
  footer#footer__thirty {
    margin-top: 20vh;
    min-height: 40vh;
    overflow: hidden;
    background-color: #000;
  }
  footer#footer__thirty .container-fluid {
    padding-top: 10vh;
    padding-bottom: 10vh;
    padding-left: 10vw;
    padding-right: 10vw;
  }
  footer#footer__thirty .container-fluid .row1 {
    margin-bottom: 5%;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-4 {
    margin: 0;
    padding: 0;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-4 img {
    margin-top: 10%;
    width: 40%;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 {
    margin-top: 2.5%;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    text-decoration: none;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul li {
    margin-right: 5vw;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul li a {
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul li a:hover {
    text-decoration: none;
    font-weight: 800;
    font-style: italic;
  }
  footer#footer__thirty .container-fluid .row2 .col1 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col1 ul li a {
    color: #fff;
    font-size: 1rem;
  }
  footer#footer__thirty .container-fluid .row2 .col1 ul li a:hover {
    text-decoration: none;
    font-weight: bold;
  }
  footer#footer__thirty .container-fluid .row2 .col2 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col2 ul li {
    font-size: 1rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col3 {
    padding: 0;
  }
  footer#footer__thirty .container-fluid .row2 .col3 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col3 ul li a {
    font-size: 1rem;
    color: #292C6D;
  }
  footer#footer__thirty .container-fluid .row3 .col-sm-12 {
    color: #fff;
  }
  main #sosmed__side {
    position: fixed;
    width: 2.5vw;
    min-height: 20vh;
    top: 50%;
    left: 0;
    border-radius: 0 15px 15px 0;
    z-index: 999;
    background-color: #292C6D;
    text-align: center;
    overflow: hidden;
  }
  main #sosmed__side ul li {
    margin: 18% 0;
  }
  main #sosmed__side ul li a {
    font-size: 1.5rem;
    color: #FFFFFF;
  }
  main #sosmed__side ul li a img {
    width: 50%;
  }
  main #header__image {
    margin-top: -10vh;
    max-height: 100vh;
    overflow: hidden;
  }
  main #text__header__image {
    position: absolute;
    max-height: 100vh;
    width: 100%;
    top: 0;
    padding: 60vh 5vh 0;
  }
  main #text__header__image h1 {
    font-size: 5rem;
    color: #FFFFFF;
    font-weight: 600;
    line-height: 113px;
  }
  main #better__services {
    min-height: 100vh;
    overflow: hidden;
  }
  main #better__services .container .row .col-sm-12 h2 {
    margin-top: 10vh;
    font-size: 3.5rem;
    font-weight: 600;
    line-height: 5rem;
  }
  main #better__services .list__services {
    margin-top: 10vh;
  }
  main #better__services .list__services .row .col-sm-6 h3 {
    font-size: 2rem;
    font-weight: 600;
    line-height: 5rem;
  }
  main #better__services .list__services .row .col-sm-6 p {
    font-size: 1rem;
    line-height: 2rem;
  }
  main #better__services .list__services__ex .row .col-sm-12 {
    display: flex;
    flex-direction: row;
  }
  main #better__services .list__services__ex .row .col-sm-12 .text__ex {
    margin-top: 24.5vh;
    margin-left: 20vw;
    position: absolute;
    z-index: 2;
  }
  main #better__services .list__services__ex .row .col-sm-12 .text__ex h2 {
    font-size: 3.5rem;
    font-weight: 600;
    line-height: 5.5rem;
  }
  main #better__services .list__services__ex .row .col-sm-12 .image__ex {
    margin-top: 20vh;
    margin-left: 40vw;
    width: 60vw;
    height: 50vh;
    border-radius: 50px 0px 0px 50px;
    box-sizing: border-box;
    background-size: cover;
    overflow: hidden;
  }
  main #better__services .list__services__ex .row .col-sm-12 .image__ex img {
    background-repeat: repeat;
    background-size: cover;
    width: 100%;
    height: 500px;
  }
  main #better__services .list__services__bottom {
    height: 45vh;
    width: 100%;
    margin-top: 10vh;
  }
  main #better__services .list__services__bottom .row .col-sm-12 p {
    font-size: 1rem;
    line-height: 2.2rem;
  }
  main #what__todo {
    min-height: 100vh;
    padding: 20vh 10vw;
    overflow: hidden;
    background-color: #292C6D;
  }
  main #what__todo .container-fluid .row .col-sm-6 {
    padding-left: 5vw;
  }
  main #what__todo .container-fluid .row .col-sm-6 .img__slide__todo {
    position: relative;
    width: 28vw;
    height: 80vh;
    border-radius: 45px;
    overflow: hidden;
    background-color: aqua;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
  }
  main #what__todo .container-fluid .row .col-sm-6 .img__slide__todo img {
    -o-object-fit: cover;
       object-fit: cover;
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
  }
  main #what__todo .container-fluid .row .col-sm-6 .img__slide__todo img.active {
    opacity: 1;
  }
  main #what__todo .container-fluid .row .col-sm-6 h2 {
    font-size: 3.5rem;
    font-weight: 600;
    color: #FFFFFF;
  }
  main #what__todo .container-fluid .row .col-sm-6 p {
    margin-top: 10vh;
    font-size: 1rem;
    line-height: 2rem;
    color: #FFFFFF;
  }
  main #what__todo .container-fluid .row .col-sm-6 .btn__lets__talk {
    font-size: 0.9rem;
    min-width: 8vw;
    min-height: 5vh;
    margin-top: 10vh;
    border-color: #FFFFFF;
    color: #FFFFFF;
    border-radius: 5px;
  }
  main #what__todo .container-fluid .row .col-sm-6 .btn__lets__talk:hover {
    background-color: #FFFFFF;
    color: #292C6D;
  }
  main #special {
    min-height: 100vh;
    overflow: hidden;
  }
  main #special .container .row1 .col-sm-12 {
    margin-top: 10vh;
    margin-bottom: 5vh;
  }
  main #special .container .row1 .col-sm-12 h2 {
    max-width: 30vw;
    font-size: 3.5rem;
    font-weight: 600;
  }
  main #special .container .row2 .col1 {
    margin: 0;
    padding: 0 0 0 2%;
  }
  main #special .container .row2 .col1 .mycard {
    position: relative;
    width: 20vw;
    height: 58vh;
    border-radius: 20px;
    overflow: hidden;
  }
  main #special .container .row2 .col1 .mycard img {
    width: 100%;
    height: 100%;
    transition: filter 0.3s;
  }
  main #special .container .row2 .col1 .mycard:hover img {
    filter: blur(3px);
  }
  main #special .container .row2 .col1 .mycard:hover .mycard__text {
    opacity: 1;
  }
  main #special .container .row2 .col1 .mycard .mycard__text {
    position: absolute;
    top: 0;
    width: 20vw;
    height: 58vh;
    line-height: 58vh;
    text-align: center;
    opacity: 0;
    transition: opacity 0.3s;
  }
  main #special .container .row2 .col1 .mycard .mycard__text .btn-thirty {
    display: inline-block;
    width: 100%;
    padding: 10px 20px;
    background-color: #fff;
    color: #000;
    text-decoration: none;
    border-radius: 5px;
  }
  main #special .container .row2 .col1 p {
    font-size: 1rem;
    line-height: 100%;
  }
  main #special .container .row2 .col2 {
    margin: 0;
    padding: 0 0 0 2%;
  }
  main #special .container .row2 .col2 .mycard {
    position: relative;
    margin-bottom: 4%;
    margin-left: 4%;
    margin-right: 0;
    padding-right: 0;
    width: 17vw;
    height: 30vh;
    border-radius: 20px;
    overflow: hidden;
  }
  main #special .container .row2 .col2 .mycard img {
    width: 100%;
    transition: filter 0.3s;
  }
  main #special .container .row2 .col2 .mycard:hover img {
    filter: blur(3px);
  }
  main #special .container .row2 .col2 .mycard:hover .mycard__text {
    opacity: 1;
  }
  main #special .container .row2 .col2 .mycard .mycard__text {
    position: absolute;
    top: 0;
    width: 17vw;
    height: 30vh;
    line-height: 30vh;
    text-align: center;
    opacity: 0;
    transition: opacity 0.3s;
  }
  main #special .container .row2 .col2 .mycard .mycard__text .btn-thirty {
    display: inline-block;
    width: 110%;
    padding: 10px 20px;
    background-color: #fff;
    color: #000;
    text-decoration: none;
  }
  main #special__slides {
    min-height: 100vh;
    overflow: hidden;
  }
  main #special__slides .container .row .col-sm-12 {
    margin-top: 10%;
    border-radius: 30px;
  }
  main #header__image__page {
    margin-top: -10vh;
    height: 100vh;
    overflow: hidden;
  }
  main #header__image__page .container-fluid .row .col-sm-12 {
    margin: 0;
    padding: 0;
  }
  main #header__image__page .container-fluid .row .col-sm-12 .container__image {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #header__image__page .container-fluid .row .col-sm-12 .container__image img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
  }
  main #text__header__image__page {
    position: absolute;
    max-height: 100vh;
    width: 100%;
    top: 0;
    padding: 35vh 30vh 0;
  }
  main #text__header__image__page h1 {
    width: 50%;
    font-size: 5rem;
    color: #292C6D;
    font-weight: 600;
    line-height: 113px;
  }
  main #about__description {
    padding-top: 5%;
  }
  main #about__description .container .row .col-sm-12 p {
    font-size: 1rem;
  }
  main #about__wwd {
    padding-top: 5%;
  }
  main #about__wwd .container .row .col-sm-12 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #about__wwd .container .row .col-sm-12 p {
    font-size: 1rem;
  }
  main #about__hwdi {
    padding-top: 5%;
  }
  main #about__hwdi .container .row .col-sm-12 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #about__hwdi .container .row .col-sm-12 p {
    font-size: 1rem;
  }
  main #about__special {
    padding-top: 5%;
  }
  main #about__special .container .row .col-sm-4 .container__image {
    height: 20vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
  }
  main #about__special .container .row .col-sm-4 .container__image img {
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  main #about__special .container .row .col-sm-4 h3 {
    margin-top: 15%;
    font-size: 2rem;
    color: #292C6D;
  }
  main #about__special .container .row .col-sm-4 p {
    font-size: 1.1rem;
  }
  main #about__awards {
    padding-top: 5%;
  }
  main #about__awards .container .row .col-sm-12 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #about__organization {
    min-height: 40vh;
    padding-top: 10%;
  }
  main #about__organization .container .row1 .col-sm-12 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #about__organization .container .row2 .col-sm-3 .container__image {
    width: 20vw;
    height: 25vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #about__organization .container .row2 .col-sm-3 .container__image img {
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  main #about__organization .container .row2 .col-sm-9 p {
    font-size: 1rem;
  }
  main #about__organization .container .row2 .col-sm-9 a {
    text-decoration: none;
    font-size: 1rem;
    color: #292C6D;
  }
  main #header__text__only {
    min-height: 100vh;
    overflow: hidden;
  }
  main #header__text__only .container-fluid {
    margin: 0;
    padding: 0;
  }
  main #header__text__only .container-fluid .row .col-sm-12 h2 {
    width: 60%;
    padding-top: 25vh;
    padding-left: 15%;
    font-size: 3.5rem;
    color: #292C6D;
  }
  main #header__text__only .container-fluid .row .col-sm-12 p {
    width: 90%;
    padding-left: 35%;
    padding-top: 20vh;
    font-size: 1rem;
  }
  main #services__card {
    min-height: 100vh;
  }
  main #services__card .container-fluid .row1 .col-sm-12 {
    padding: 5% 5%;
  }
  main #services__card .container-fluid .row1 .col-sm-12 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #services__card .container-fluid .row2 {
    padding: 0 5%;
  }
  main #services__card .container-fluid .row2 .col-sm-4 {
    margin-bottom: 5%;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services {
    width: 26vw;
    height: 70vh;
    padding: 20%;
    border-radius: 20px;
    overflow: hidden;
    background-color: #F6F6F6;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services .container__image {
    position: relative;
    width: 15vw;
    height: 20vh;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services .container__image img {
    -o-object-fit: cover;
       object-fit: cover;
    max-width: 100%;
    max-height: 100%;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services p {
    font-size: 1rem;
  }
  main #contact {
    min-height: 100vh;
    padding: 15% 5%;
  }
  main #contact .container-fluid .row .col1 {
    padding-right: 5%;
  }
  main #contact .container-fluid .row .col1 h2 {
    font-size: 3.5rem;
  }
  main #contact .container-fluid .row .col1 p {
    font-size: 1rem;
  }
  main #contact .container-fluid .row .col1 h4 {
    font-size: 2rem;
  }
  main #contact .container-fluid .row .col1 ul li a {
    text-decoration: none;
    color: #000;
    font-size: 1rem;
  }
  main #contact .container-fluid .row .col2 {
    padding-top: 5%;
  }
  main #contact .container-fluid .row .col2 .form-group .form-control {
    border-top: none;
    border-left: none;
    border-right: none;
  }
  main #contact .container-fluid .row .col2 .form-group .btn-send {
    width: 20vw;
    height: 7vh;
    font-size: 1rem;
    color: #000;
    background-color: #fff;
  }
  main #family {
    min-height: 100vh;
    padding: 10% 0;
  }
  main #family .container-fluid {
    margin: 0;
    padding: 0;
  }
  main #family .container-fluid .row1 .col-sm-12 {
    padding: 5% 10%;
  }
  main #family .container-fluid .row1 .col-sm-12 h2 {
    width: 30%;
    font-size: 3.5rem;
    color: #292C6D;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan {
    min-height: 40vh;
    width: 100%;
    padding: 10%;
    background-color: #292C6D;
    color: #fff;
    overflow: hidden;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan .title {
    font-size: 1.5rem;
    font-weight: 600;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan .subtitle {
    font-size: 1.3rem;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan .desc {
    font-size: 1.2rem;
    margin-top: 2%;
  }
  main #family .container-fluid .row2 .col-sm-8 .card-deck .card {
    max-width: 20vw;
    cursor: pointer;
  }
  main #family .container-fluid .row2 .col-sm-8 .card-deck .card .card-image {
    width: 100%;
    height: 55vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #family .container-fluid .row2 .col-sm-8 .card-deck .card .card-image img {
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  main #header__values {
    margin-top: -10vh;
    height: 100vh;
    overflow: hidden;
    background-color: #292C6D;
    padding: 20% 20%;
  }
  main #header__values .container-fluid .row .col-sm-12 h2 {
    font-size: 3.5rem;
    color: #fff;
  }
  main #header__values .container-fluid .row .col-sm-12 p {
    font-size: 1rem;
    color: #fff;
  }
  main #section__value1 {
    min-height: 70vh;
    padding: 5%;
  }
  main #section__value1 .container .row .col-sm-12 {
    padding: 2% 0;
  }
  main #section__value1 .container .row .col-sm-12 .row .col-sm-4 h3 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #section__value1 .container .row .col-sm-12 .row .col-sm-8 p {
    font-size: 1rem;
  }
  main #garis__pletan {
    margin-top: -45%;
    margin-bottom: 10%;
    min-height: 70vh;
    width: 100%;
    overflow: hidden;
  }
  main #garis__pletan .container-fluid {
    margin: 0;
    padding: 0;
  }
  main #garis__pletan .container-fluid .row .col-sm-12 {
    display: flex;
    flex-direction: column;
    align-items: end;
  }
  main #garis__pletan .container-fluid .row .col-sm-12 .garis__plet {
    margin: 5% 0;
    width: 200px;
    height: 2px;
    background-color: #000;
  }
  main #section__value2 {
    min-height: 50vh;
    padding: 5%;
    overflow: hidden;
  }
  main #section__value2 .container .row .col-sm-12 h3 {
    margin-bottom: 5%;
    width: 50%;
    font-size: 2rem;
    color: #292C6D;
  }
  main #section__value2 .container .row .col-sm-12 p {
    padding-left: 30%;
    font-size: 1rem;
  }
  main #header__career {
    height: 100vh;
    overflow: hidden;
    padding: 20% 20%;
    border-bottom: 1px solid #000;
  }
  main #header__career .container-fluid .row .col-sm-12 h2 {
    font-size: 3.5rem;
    color: #292C6D;
  }
  main #header__career .container-fluid .row .col-sm-12 p {
    font-size: 1rem;
    color: #292C6D;
  }
  main #section__careers {
    min-height: 100vh;
    padding: 10% 5%;
  }
  main #section__careers .container-fluid .row1 {
    padding: 5% 2%;
  }
  main #section__careers .container-fluid .row1 .col-sm-4 h3 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #section__careers .container-fluid .row1 .col-sm-8 {
    font-size: 1rem;
  }
  main #section__careers .container-fluid .row2 {
    padding: 2%;
    border-top: 1px solid #000;
  }
  main #section__careers .container-fluid .row2 .col-sm-4 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #section__careers .container-fluid .row2 .col-sm-6 p {
    font-size: 1rem;
  }
  main #section__careers .container-fluid .row2 .col-sm-6 .btn-primary {
    margin-left: 80%;
    background-color: #292C6D;
  }
  main #header__podcast {
    margin-top: -10vh;
    height: 100vh;
    overflow: hidden;
  }
  main #header__podcast .container-fluid .row .col-sm-12 {
    margin: 0;
    padding: 0;
  }
  main #header__podcast .container-fluid .row .col-sm-12 .container__image {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #header__podcast .container-fluid .row .col-sm-12 .container__image img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
  }
  main #text__header__podcast {
    position: absolute;
    max-height: 100vh;
    width: 100%;
    top: 0;
    padding: 25vh 30vh;
  }
  main #text__header__podcast h1 {
    width: 70%;
    font-size: 5rem;
    color: #fff;
    font-weight: 600;
    line-height: 113px;
  }
  main #text__header__podcast p {
    width: 60%;
    font-size: 1rem;
    color: #fff;
  }
  main #text__header__podcast .btn-listen {
    background-color: rgba(255, 255, 255, 0.5);
    color: #ffffff;
    display: inline-block;
    padding: 10px 20px;
    text-decoration: none;
  }
  main #text__header__podcast .btn-listen img {
    vertical-align: middle;
    margin-left: 5px;
  }
  main #text__header__podcast .btn-listen:hover {
    background-color: rgba(255, 255, 255, 0.8);
  }
  main #podcast__section1 {
    min-height: 50vh;
    padding: 10% 2%;
    overflow: hidden;
  }
  main #podcast__section1 .container-fluid .row .col1 h3 {
    width: 30%;
    color: #fff;
    font-size: 2rem;
  }
  main #podcast__section1 .container-fluid .row .col2 .row2 .col-sm-12 ul {
    display: inline-block;
    margin-right: 5px;
  }
  main #podcast__section1 .container-fluid .row .col2 .row2 .col-sm-12 ul li .line__kntl {
    width: 5vw;
    height: 1px;
    background-color: #fff;
  }
  main #podcast__section1 .container-fluid .row .col2 .row2 .col-sm-12 ul li a {
    font-size: 1rem;
    color: #fff;
  }
  main #podcast__section2 {
    min-height: 100vh;
    margin-bottom: 5%;
  }
  main #podcast__section2 .container .row1 .col-sm-12 h3 {
    font-size: 2rem;
    color: #fff;
  }
  main #podcast__section3 {
    min-height: 40vh;
    padding: 5% 0;
  }
  main #podcast__section3 .container .row .col1 h3 {
    font-size: 2rem;
    color: #fff;
  }
  main #podcast__section3 .container .row .col1 p {
    font-size: 1rem;
    color: #fff;
  }
  main #podcast__section3 .container .row .col2 {
    padding: auto;
  }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  #popup__menu {
    position: fixed;
    z-index: 9999;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #292C6D;
    animation-name: scaleAnimation;
    animation-duration: 1s;
    animation-fill-mode: both;
    display: none;
  }
  #popup__menu .container-fluid .row1 .col-sm-12 .menu__close {
    font-size: 2rem;
    color: #fff;
    text-decoration: none;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div1 {
    margin-top: auto;
    width: 50vw;
    height: 100vh;
    padding: 40% 5% 10% 5%;
    bottom: 0;
    color: #fff;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div1 h2 {
    font-size: 2rem;
    color: #fff;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div2 {
    width: 50vw;
    height: 100vh;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div2 ul li a {
    font-size: 3.5rem;
    color: #fff;
    font-weight: 600;
  }
  #popup__menu__second {
    position: fixed;
    z-index: 9999;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #000;
    animation-name: scaleAnimation;
    animation-duration: 1s;
    animation-fill-mode: both;
    display: none;
  }
  #popup__menu__second .container-fluid .row1 .col-sm-12 .menu__close {
    font-size: 2rem;
    color: #fff;
    text-decoration: none;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div1 {
    margin-top: auto;
    width: 50vw;
    height: 100vh;
    padding: 40% 5% 10% 5%;
    bottom: 0;
    color: #fff;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div1 h2 {
    font-size: 2rem;
    color: #fff;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div2 {
    width: 50vw;
    height: 100vh;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div2 ul li a {
    font-size: 3.5rem;
    color: #fff;
    font-weight: 600;
  }
  header .navbar {
    margin-left: 5vw;
    margin-right: 5vw;
  }
  header .navbar a {
    margin: 2% 0;
  }
  header .navbar a img {
    width: 100%;
  }
  header .navbar .collapse .navbar-nav .nav-item {
    margin-left: 2vw;
  }
  header .navbar .collapse .navbar-nav .nav-item a {
    font-size: 1rem;
    color: #fff;
  }
  header .navbar .collapse .navbar-nav .nav-item .nav-link-second {
    font-size: 1rem;
    color: #292C6D;
  }
  footer {
    margin-top: -50vh;
    min-height: 70vh;
    overflow: hidden;
    background-color: #292C6D;
  }
  footer .container-fluid {
    padding-top: 50vh;
    padding-bottom: 10vh;
    padding-left: 10vw;
    padding-right: 10vw;
  }
  footer .container-fluid .row1 {
    margin-bottom: 5%;
  }
  footer .container-fluid .row1 .col-sm-4 {
    margin: 0;
    padding: 0;
  }
  footer .container-fluid .row1 .col-sm-4 img {
    margin-top: 10%;
    width: 40%;
  }
  footer .container-fluid .row1 .col-sm-8 {
    margin-top: 2.5%;
  }
  footer .container-fluid .row1 .col-sm-8 ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    text-decoration: none;
  }
  footer .container-fluid .row1 .col-sm-8 ul li {
    margin-right: 5vw;
  }
  footer .container-fluid .row1 .col-sm-8 ul li a {
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
  }
  footer .container-fluid .row1 .col-sm-8 ul li a:hover {
    text-decoration: none;
    font-weight: 800;
    font-style: italic;
  }
  footer .container-fluid .row2 .col1 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col1 ul li a {
    color: #fff;
    font-size: 1rem;
  }
  footer .container-fluid .row2 .col1 ul li a:hover {
    text-decoration: none;
    font-weight: bold;
  }
  footer .container-fluid .row2 .col2 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col2 ul li {
    font-size: 1rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col3 {
    padding: 0;
  }
  footer .container-fluid .row2 .col3 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col3 ul li a {
    font-size: 1rem;
    color: #292C6D;
  }
  footer .container-fluid .row3 .col-sm-12 {
    color: #fff;
  }
  footer#footer__second {
    margin-top: 20vh;
    min-height: 40vh;
    overflow: hidden;
    background-color: #292C6D;
  }
  footer#footer__second .container-fluid {
    padding-top: 10vh;
    padding-bottom: 10vh;
    padding-left: 10vw;
    padding-right: 10vw;
  }
  footer#footer__second .container-fluid .row1 {
    margin-bottom: 5%;
  }
  footer#footer__second .container-fluid .row1 .col-sm-4 {
    margin: 0;
    padding: 0;
  }
  footer#footer__second .container-fluid .row1 .col-sm-4 img {
    margin-top: 10%;
    width: 40%;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 {
    margin-top: 2.5%;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    text-decoration: none;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul li {
    margin-right: 5vw;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul li a {
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul li a:hover {
    text-decoration: none;
    font-weight: 800;
    font-style: italic;
  }
  footer#footer__second .container-fluid .row2 .col1 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col1 ul li a {
    color: #fff;
    font-size: 1rem;
  }
  footer#footer__second .container-fluid .row2 .col1 ul li a:hover {
    text-decoration: none;
    font-weight: bold;
  }
  footer#footer__second .container-fluid .row2 .col2 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col2 ul li {
    font-size: 1rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col3 {
    padding: 0;
  }
  footer#footer__second .container-fluid .row2 .col3 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col3 ul li a {
    font-size: 1rem;
    color: #292C6D;
  }
  footer#footer__second .container-fluid .row3 .col-sm-12 {
    color: #fff;
  }
  footer#footer__thirty {
    margin-top: 20vh;
    min-height: 40vh;
    overflow: hidden;
    background-color: #000;
  }
  footer#footer__thirty .container-fluid {
    padding-top: 10vh;
    padding-bottom: 10vh;
    padding-left: 10vw;
    padding-right: 10vw;
  }
  footer#footer__thirty .container-fluid .row1 {
    margin-bottom: 5%;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-4 {
    margin: 0;
    padding: 0;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-4 img {
    margin-top: 10%;
    width: 40%;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 {
    margin-top: 2.5%;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    text-decoration: none;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul li {
    margin-right: 5vw;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul li a {
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul li a:hover {
    text-decoration: none;
    font-weight: 800;
    font-style: italic;
  }
  footer#footer__thirty .container-fluid .row2 .col1 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col1 ul li a {
    color: #fff;
    font-size: 1rem;
  }
  footer#footer__thirty .container-fluid .row2 .col1 ul li a:hover {
    text-decoration: none;
    font-weight: bold;
  }
  footer#footer__thirty .container-fluid .row2 .col2 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col2 ul li {
    font-size: 1rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col3 {
    padding: 0;
  }
  footer#footer__thirty .container-fluid .row2 .col3 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col3 ul li a {
    font-size: 1rem;
    color: #292C6D;
  }
  footer#footer__thirty .container-fluid .row3 .col-sm-12 {
    color: #fff;
  }
  main #sosmed__side {
    position: fixed;
    width: 2.5vw;
    min-height: 20vh;
    top: 50%;
    left: 0;
    border-radius: 0 15px 15px 0;
    z-index: 999;
    background-color: #292C6D;
    text-align: center;
    overflow: hidden;
  }
  main #sosmed__side ul li {
    margin: 18% 0;
  }
  main #sosmed__side ul li a {
    font-size: 1.5rem;
    color: #FFFFFF;
  }
  main #sosmed__side ul li a img {
    width: 50%;
  }
  main #header__image {
    max-height: 100vh;
    overflow: hidden;
  }
  main #text__header__image {
    position: absolute;
    max-height: 100vh;
    width: 100%;
    top: 0;
    padding: 60vh 5vh 0;
  }
  main #text__header__image h1 {
    font-size: 5rem;
    color: #FFFFFF;
    font-weight: 600;
    line-height: 113px;
  }
  main #better__services {
    min-height: 100vh;
    overflow: hidden;
  }
  main #better__services .container .row .col-sm-12 h2 {
    margin-top: 10vh;
    font-size: 3.5rem;
    font-weight: 600;
    line-height: 5rem;
  }
  main #better__services .list__services {
    margin-top: 10vh;
  }
  main #better__services .list__services .row .col-sm-6 h3 {
    font-size: 2rem;
    font-weight: 600;
    line-height: 5rem;
  }
  main #better__services .list__services .row .col-sm-6 p {
    font-size: 1rem;
    line-height: 2rem;
  }
  main #better__services .list__services__ex .row .col-sm-12 {
    display: flex;
    flex-direction: row;
  }
  main #better__services .list__services__ex .row .col-sm-12 .text__ex {
    margin-top: 24.5vh;
    margin-left: 20vw;
    position: absolute;
    z-index: 2;
  }
  main #better__services .list__services__ex .row .col-sm-12 .text__ex h2 {
    font-size: 3.5rem;
    font-weight: 600;
    line-height: 5.5rem;
  }
  main #better__services .list__services__ex .row .col-sm-12 .image__ex {
    margin-top: 20vh;
    margin-left: 40vw;
    width: 60vw;
    height: 50vh;
    border-radius: 50px 0px 0px 50px;
    box-sizing: border-box;
    background-size: cover;
    overflow: hidden;
  }
  main #better__services .list__services__ex .row .col-sm-12 .image__ex img {
    background-repeat: repeat;
    background-size: cover;
    width: 100%;
    height: 500px;
  }
  main #better__services .list__services__bottom {
    height: 45vh;
    width: 100%;
    margin-top: 10vh;
  }
  main #better__services .list__services__bottom .row .col-sm-12 p {
    font-size: 1rem;
    line-height: 2.2rem;
  }
  main #what__todo {
    min-height: 100vh;
    padding: 20vh 10vw;
    overflow: hidden;
    background-color: #292C6D;
  }
  main #what__todo .container-fluid .row .col-sm-6 {
    padding-left: 5vw;
  }
  main #what__todo .container-fluid .row .col-sm-6 .img__slide__todo {
    position: relative;
    width: 28vw;
    height: 80vh;
    border-radius: 45px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
  }
  main #what__todo .container-fluid .row .col-sm-6 .img__slide__todo img {
    -o-object-fit: cover;
       object-fit: cover;
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
  }
  main #what__todo .container-fluid .row .col-sm-6 .img__slide__todo img.active {
    opacity: 1;
  }
  main #what__todo .container-fluid .row .col-sm-6 h2 {
    font-size: 3.5rem;
    font-weight: 600;
    color: #FFFFFF;
  }
  main #what__todo .container-fluid .row .col-sm-6 p {
    margin-top: 10vh;
    font-size: 1rem;
    line-height: 2rem;
    color: #FFFFFF;
  }
  main #what__todo .container-fluid .row .col-sm-6 .btn__lets__talk {
    font-size: 0.9rem;
    min-width: 8vw;
    min-height: 5vh;
    margin-top: 10vh;
    border-color: #FFFFFF;
    color: #FFFFFF;
    border-radius: 5px;
  }
  main #what__todo .container-fluid .row .col-sm-6 .btn__lets__talk:hover {
    background-color: #FFFFFF;
    color: #292C6D;
  }
  main #special {
    min-height: 100vh;
    overflow: hidden;
  }
  main #special .container .row1 .col-sm-12 {
    margin-top: 10vh;
    margin-bottom: 5vh;
  }
  main #special .container .row1 .col-sm-12 h2 {
    max-width: 30vw;
    font-size: 3.5rem;
    font-weight: 600;
  }
  main #special .container .row2 .col1 {
    margin: 0;
    padding: 0 0 0 2%;
  }
  main #special .container .row2 .col1 .mycard {
    position: relative;
    width: 20vw;
    height: 58vh;
    border-radius: 20px;
    overflow: hidden;
  }
  main #special .container .row2 .col1 .mycard img {
    width: 100%;
    height: 100%;
    transition: filter 0.3s;
  }
  main #special .container .row2 .col1 .mycard:hover img {
    filter: blur(3px);
  }
  main #special .container .row2 .col1 .mycard:hover .mycard__text {
    opacity: 1;
  }
  main #special .container .row2 .col1 .mycard .mycard__text {
    position: absolute;
    top: 0;
    width: 20vw;
    height: 58vh;
    line-height: 58vh;
    text-align: center;
    opacity: 0;
    transition: opacity 0.3s;
  }
  main #special .container .row2 .col1 .mycard .mycard__text .btn-thirty {
    display: inline-block;
    width: 100%;
    padding: 10px 20px;
    background-color: #fff;
    color: #000;
    text-decoration: none;
    border-radius: 5px;
  }
  main #special .container .row2 .col1 p {
    font-size: 1rem;
    line-height: 100%;
  }
  main #special .container .row2 .col2 {
    margin: 0;
    padding: 0 0 0 2%;
  }
  main #special .container .row2 .col2 .mycard {
    position: relative;
    margin-bottom: 4%;
    margin-left: 4%;
    margin-right: 0;
    padding-right: 0;
    width: 17vw;
    height: 30vh;
    border-radius: 20px;
    overflow: hidden;
  }
  main #special .container .row2 .col2 .mycard img {
    width: 100%;
    transition: filter 0.3s;
  }
  main #special .container .row2 .col2 .mycard:hover img {
    filter: blur(3px);
  }
  main #special .container .row2 .col2 .mycard:hover .mycard__text {
    opacity: 1;
  }
  main #special .container .row2 .col2 .mycard .mycard__text {
    position: absolute;
    top: 0;
    width: 17vw;
    height: 30vh;
    line-height: 30vh;
    text-align: center;
    opacity: 0;
    transition: opacity 0.3s;
  }
  main #special .container .row2 .col2 .mycard .mycard__text .btn-thirty {
    display: inline-block;
    width: 110%;
    padding: 10px 20px;
    background-color: #fff;
    color: #000;
    text-decoration: none;
  }
  main #special__slides {
    min-height: 100vh;
    overflow: hidden;
  }
  main #special__slides .container .row .col-sm-12 {
    margin-top: 10%;
    border-radius: 30px;
  }
  main #header__image__page {
    margin-top: -10vh;
    height: 100vh;
    overflow: hidden;
  }
  main #header__image__page .container-fluid .row .col-sm-12 {
    margin: 0;
    padding: 0;
  }
  main #header__image__page .container-fluid .row .col-sm-12 .container__image {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #header__image__page .container-fluid .row .col-sm-12 .container__image img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
  }
  main #text__header__image__page {
    position: absolute;
    max-height: 100vh;
    width: 100%;
    top: 0;
    padding: 35vh 30vh 0;
  }
  main #text__header__image__page h1 {
    width: 50%;
    font-size: 6rem;
    color: #292C6D;
    font-weight: 600;
    line-height: 113px;
  }
  main #about__description {
    padding-top: 5%;
  }
  main #about__description .container .row .col-sm-12 p {
    font-size: 1rem;
  }
  main #about__wwd {
    padding-top: 5%;
  }
  main #about__wwd .container .row .col-sm-12 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #about__wwd .container .row .col-sm-12 p {
    font-size: 1rem;
  }
  main #about__hwdi {
    padding-top: 5%;
  }
  main #about__hwdi .container .row .col-sm-12 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #about__hwdi .container .row .col-sm-12 p {
    font-size: 1rem;
  }
  main #about__special {
    padding-top: 5%;
  }
  main #about__special .container .row .col-sm-4 .container__image {
    height: 20vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #about__special .container .row .col-sm-4 .container__image img {
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  main #about__special .container .row .col-sm-4 h3 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #about__special .container .row .col-sm-4 p {
    font-size: 1rem;
  }
  main #about__awards {
    padding-top: 5%;
  }
  main #about__awards .container .row .col-sm-12 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #about__organization {
    min-height: 40vh;
    padding-top: 10%;
  }
  main #about__organization .container .row1 .col-sm-12 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #about__organization .container .row2 .col-sm-3 .container__image {
    width: 20vw;
    height: 25vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #about__organization .container .row2 .col-sm-3 .container__image img {
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  main #about__organization .container .row2 .col-sm-9 p {
    font-size: 1rem;
  }
  main #about__organization .container .row2 .col-sm-9 a {
    text-decoration: none;
    font-size: 1rem;
    color: #292C6D;
  }
  main #header__text__only {
    min-height: 100vh;
    overflow: hidden;
  }
  main #header__text__only .container-fluid {
    margin: 0;
    padding: 0;
  }
  main #header__text__only .container-fluid .row .col-sm-12 h2 {
    width: 60%;
    padding-top: 25vh;
    padding-left: 15%;
    font-size: 3.5rem;
    color: #292C6D;
  }
  main #header__text__only .container-fluid .row .col-sm-12 p {
    width: 90%;
    padding-left: 35%;
    padding-top: 15vh;
    font-size: 1rem;
  }
  main #services__card {
    min-height: 100vh;
  }
  main #services__card .container-fluid .row1 .col-sm-12 {
    padding: 5% 5%;
  }
  main #services__card .container-fluid .row1 .col-sm-12 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #services__card .container-fluid .row2 {
    padding: 0 5%;
  }
  main #services__card .container-fluid .row2 .col-sm-4 {
    margin-bottom: 5%;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services {
    width: 26vw;
    height: 70vh;
    padding: 20%;
    border-radius: 20px;
    overflow: hidden;
    background-color: #F6F6F6;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services .container__image {
    position: relative;
    width: 15vw;
    height: 20vh;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services .container__image img {
    -o-object-fit: cover;
       object-fit: cover;
    max-width: 100%;
    max-height: 100%;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services p {
    font-size: 1rem;
  }
  main #contact {
    min-height: 100vh;
    padding: 15% 5%;
  }
  main #contact .container-fluid .row .col1 {
    padding-right: 5%;
  }
  main #contact .container-fluid .row .col1 h2 {
    font-size: 3.5rem;
  }
  main #contact .container-fluid .row .col1 p {
    font-size: 1rem;
  }
  main #contact .container-fluid .row .col1 h4 {
    font-size: 2rem;
  }
  main #contact .container-fluid .row .col1 ul li a {
    text-decoration: none;
    color: #000;
    font-size: 1rem;
  }
  main #contact .container-fluid .row .col2 {
    padding-top: 5%;
  }
  main #contact .container-fluid .row .col2 .form-group .form-control {
    border-top: none;
    border-left: none;
    border-right: none;
  }
  main #contact .container-fluid .row .col2 .form-group .btn-send {
    width: 20vw;
    height: 7vh;
    font-size: 1rem;
    color: #000;
    background-color: #fff;
  }
  main #family {
    min-height: 100vh;
    padding: 10% 0;
  }
  main #family .container-fluid {
    margin: 0;
    padding: 0;
  }
  main #family .container-fluid .row1 .col-sm-12 {
    padding: 5% 10%;
  }
  main #family .container-fluid .row1 .col-sm-12 h2 {
    width: 30%;
    font-size: 3.5rem;
    color: #292C6D;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan {
    min-height: 40vh;
    width: 100%;
    padding: 10%;
    background-color: #292C6D;
    color: #fff;
    overflow: hidden;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan .title {
    font-size: 2rem;
    font-weight: 600;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan .subtitle {
    font-size: 2rem;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan .desc {
    font-size: 1rem;
    margin-top: 2%;
  }
  main #family .container-fluid .row2 .col-sm-8 .card-deck .card {
    max-width: 20vw;
    cursor: pointer;
  }
  main #family .container-fluid .row2 .col-sm-8 .card-deck .card .card-image {
    width: 100%;
    height: 55vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #family .container-fluid .row2 .col-sm-8 .card-deck .card .card-image img {
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  main #header__values {
    margin-top: -10vh;
    height: 100vh;
    overflow: hidden;
    background-color: #292C6D;
    padding: 20% 20%;
  }
  main #header__values .container-fluid .row .col-sm-12 h2 {
    font-size: 3.5rem;
    color: #fff;
  }
  main #header__values .container-fluid .row .col-sm-12 p {
    font-size: 1rem;
    color: #fff;
  }
  main #section__value1 {
    min-height: 70vh;
    padding: 5%;
  }
  main #section__value1 .container .row .col-sm-12 {
    padding: 2% 0;
  }
  main #section__value1 .container .row .col-sm-12 .row .col-sm-4 h3 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #section__value1 .container .row .col-sm-12 .row .col-sm-8 p {
    font-size: 1rem;
  }
  main #garis__pletan {
    margin-top: -45%;
    margin-bottom: 10%;
    min-height: 70vh;
    width: 100%;
    overflow: hidden;
  }
  main #garis__pletan .container-fluid {
    margin: 0;
    padding: 0;
  }
  main #garis__pletan .container-fluid .row .col-sm-12 {
    display: flex;
    flex-direction: column;
    align-items: end;
  }
  main #garis__pletan .container-fluid .row .col-sm-12 .garis__plet {
    margin: 5% 0;
    width: 200px;
    height: 2px;
    background-color: #000;
  }
  main #section__value2 {
    min-height: 50vh;
    padding: 5%;
    overflow: hidden;
  }
  main #section__value2 .container .row .col-sm-12 h3 {
    margin-bottom: 5%;
    width: 50%;
    font-size: 2rem;
    color: #292C6D;
  }
  main #section__value2 .container .row .col-sm-12 p {
    padding-left: 30%;
    font-size: 1rem;
  }
  main #header__career {
    height: 100vh;
    overflow: hidden;
    padding: 20% 20%;
    border-bottom: 1px solid #000;
  }
  main #header__career .container-fluid .row .col-sm-12 h2 {
    font-size: 3.5rem;
    color: #292C6D;
  }
  main #header__career .container-fluid .row .col-sm-12 p {
    font-size: 1rem;
    color: #292C6D;
  }
  main #section__careers {
    min-height: 100vh;
    padding: 10% 5%;
  }
  main #section__careers .container-fluid .row1 {
    padding: 5% 2%;
  }
  main #section__careers .container-fluid .row1 .col-sm-4 h3 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #section__careers .container-fluid .row1 .col-sm-8 {
    font-size: 1rem;
  }
  main #section__careers .container-fluid .row2 {
    padding: 2%;
    border-top: 1px solid #000;
  }
  main #section__careers .container-fluid .row2 .col-sm-4 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #section__careers .container-fluid .row2 .col-sm-6 p {
    font-size: 1rem;
  }
  main #section__careers .container-fluid .row2 .col-sm-6 .btn-primary {
    margin-left: 80%;
    background-color: #292C6D;
  }
  main #header__podcast {
    margin-top: -10vh;
    height: 100vh;
    overflow: hidden;
  }
  main #header__podcast .container-fluid .row .col-sm-12 {
    margin: 0;
    padding: 0;
  }
  main #header__podcast .container-fluid .row .col-sm-12 .container__image {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #header__podcast .container-fluid .row .col-sm-12 .container__image img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
  }
  main #text__header__podcast {
    position: absolute;
    max-height: 100vh;
    width: 100%;
    top: 0;
    padding: 25vh 30vh;
  }
  main #text__header__podcast h1 {
    width: 70%;
    font-size: 6rem;
    color: #fff;
    font-weight: 600;
    line-height: 113px;
  }
  main #text__header__podcast p {
    width: 60%;
    font-size: 1rem;
    color: #fff;
  }
  main #text__header__podcast .btn-listen {
    background-color: rgba(255, 255, 255, 0.5);
    color: #ffffff;
    display: inline-block;
    padding: 10px 20px;
    text-decoration: none;
  }
  main #text__header__podcast .btn-listen img {
    vertical-align: middle;
    margin-left: 5px;
  }
  main #text__header__podcast .btn-listen:hover {
    background-color: rgba(255, 255, 255, 0.8);
  }
  main #podcast__section1 {
    min-height: 50vh;
    padding: 10% 2%;
    overflow: hidden;
  }
  main #podcast__section1 .container-fluid .row .col1 h3 {
    width: 30%;
    color: #fff;
    font-size: 2rem;
  }
  main #podcast__section1 .container-fluid .row .col2 .row2 .col-sm-12 ul {
    display: inline-block;
    margin-right: 5px;
  }
  main #podcast__section1 .container-fluid .row .col2 .row2 .col-sm-12 ul li .line__kntl {
    width: 5vw;
    height: 1px;
    background-color: #fff;
  }
  main #podcast__section1 .container-fluid .row .col2 .row2 .col-sm-12 ul li a {
    font-size: 1rem;
    color: #fff;
  }
  main #podcast__section2 {
    min-height: 100vh;
    margin-bottom: 5%;
  }
  main #podcast__section2 .container .row1 .col-sm-12 h3 {
    font-size: 2rem;
    color: #fff;
  }
  main #podcast__section3 {
    min-height: 40vh;
    padding: 5% 0;
  }
  main #podcast__section3 .container .row .col1 h3 {
    font-size: 2rem;
    color: #fff;
  }
  main #podcast__section3 .container .row .col1 p {
    font-size: 1rem;
    color: #fff;
  }
  main #podcast__section3 .container .row .col2 {
    padding: auto;
  }
}
@media (min-width: 1200px) {
  #popup__menu {
    position: fixed;
    z-index: 9999;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #292C6D;
    animation-name: scaleAnimation;
    animation-duration: 1s;
    animation-fill-mode: both;
    display: none;
  }
  #popup__menu .container-fluid .row1 .col-sm-12 .menu__close {
    font-size: 2rem;
    color: #fff;
    text-decoration: none;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div1 {
    margin-top: auto;
    width: 50vw;
    height: 100vh;
    padding: 40% 5% 10% 5%;
    bottom: 0;
    color: #fff;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div1 h2 {
    font-size: 2rem;
    color: #fff;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div2 {
    width: 50vw;
    height: 100vh;
  }
  #popup__menu .container-fluid .row2 .col-sm-12 .div2 ul li a {
    font-size: 3.5rem;
    color: #fff;
    font-weight: 600;
  }
  #popup__menu__second {
    position: fixed;
    z-index: 9999;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #000;
    animation-name: scaleAnimation;
    animation-duration: 1s;
    animation-fill-mode: both;
    display: none;
  }
  #popup__menu__second .container-fluid .row1 .col-sm-12 .menu__close {
    font-size: 2rem;
    color: #fff;
    text-decoration: none;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div1 {
    margin-top: auto;
    width: 50vw;
    height: 100vh;
    padding: 40% 5% 10% 5%;
    bottom: 0;
    color: #fff;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div1 h2 {
    font-size: 2rem;
    color: #fff;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div2 {
    width: 50vw;
    height: 100vh;
  }
  #popup__menu__second .container-fluid .row2 .col-sm-12 .div2 ul li a {
    font-size: 3.5rem;
    color: #fff;
    font-weight: 600;
  }
  header {
    height: 10vh;
    position: relative;
    z-index: 2;
  }
  header .navbar {
    margin-left: 5vw;
    margin-right: 5vw;
  }
  header .navbar a {
    margin: 2% 0;
  }
  header .navbar a img {
    width: 100%;
  }
  header .navbar .collapse .navbar-nav .nav-item {
    margin-left: 2vw;
  }
  header .navbar .collapse .navbar-nav .nav-item a {
    font-size: 1rem;
    color: #fff;
  }
  header .navbar .collapse .navbar-nav .nav-item .nav-link-second {
    font-size: 1rem;
    color: #292C6D;
  }
  footer {
    margin-top: -50vh;
    min-height: 70vh;
    overflow: hidden;
    background-color: #292C6D;
  }
  footer .container-fluid {
    padding-top: 50vh;
    padding-bottom: 10vh;
    padding-left: 10vw;
    padding-right: 10vw;
  }
  footer .container-fluid .row1 {
    margin-bottom: 5%;
  }
  footer .container-fluid .row1 .col-sm-4 {
    margin: 0;
    padding: 0;
  }
  footer .container-fluid .row1 .col-sm-4 img {
    margin-top: 10%;
    width: 40%;
  }
  footer .container-fluid .row1 .col-sm-8 {
    margin-top: 2.5%;
  }
  footer .container-fluid .row1 .col-sm-8 ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    text-decoration: none;
  }
  footer .container-fluid .row1 .col-sm-8 ul li {
    margin-right: 5vw;
  }
  footer .container-fluid .row1 .col-sm-8 ul li a {
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
  }
  footer .container-fluid .row1 .col-sm-8 ul li a:hover {
    text-decoration: none;
    font-weight: 800;
    font-style: italic;
  }
  footer .container-fluid .row2 .col1 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col1 ul li a {
    color: #fff;
    font-size: 1rem;
  }
  footer .container-fluid .row2 .col1 ul li a:hover {
    text-decoration: none;
    font-weight: bold;
  }
  footer .container-fluid .row2 .col2 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col2 ul li {
    font-size: 1rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col3 {
    padding: 0;
  }
  footer .container-fluid .row2 .col3 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer .container-fluid .row2 .col3 ul li a {
    font-size: 1rem;
    color: #292C6D;
  }
  footer .container-fluid .row3 .col-sm-12 {
    color: #fff;
  }
  footer#footer__second {
    margin-top: 20vh;
    min-height: 40vh;
    overflow: hidden;
    background-color: #292C6D;
  }
  footer#footer__second .container-fluid {
    padding-top: 10vh;
    padding-bottom: 10vh;
    padding-left: 10vw;
    padding-right: 10vw;
  }
  footer#footer__second .container-fluid .row1 {
    margin-bottom: 5%;
  }
  footer#footer__second .container-fluid .row1 .col-sm-4 {
    margin: 0;
    padding: 0;
  }
  footer#footer__second .container-fluid .row1 .col-sm-4 img {
    margin-top: 10%;
    width: 40%;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 {
    margin-top: 2.5%;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    text-decoration: none;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul li {
    margin-right: 5vw;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul li a {
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
  }
  footer#footer__second .container-fluid .row1 .col-sm-8 ul li a:hover {
    text-decoration: none;
    font-weight: 800;
    font-style: italic;
  }
  footer#footer__second .container-fluid .row2 .col1 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col1 ul li a {
    color: #fff;
    font-size: 1rem;
  }
  footer#footer__second .container-fluid .row2 .col1 ul li a:hover {
    text-decoration: none;
    font-weight: bold;
  }
  footer#footer__second .container-fluid .row2 .col2 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col2 ul li {
    font-size: 1rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col3 {
    padding: 0;
  }
  footer#footer__second .container-fluid .row2 .col3 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__second .container-fluid .row2 .col3 ul li a {
    font-size: 1rem;
    color: #292C6D;
  }
  footer#footer__second .container-fluid .row3 .col-sm-12 {
    color: #fff;
  }
  footer#footer__thirty {
    margin-top: 20vh;
    min-height: 40vh;
    overflow: hidden;
    background-color: #000;
  }
  footer#footer__thirty .container-fluid {
    padding-top: 10vh;
    padding-bottom: 10vh;
    padding-left: 10vw;
    padding-right: 10vw;
  }
  footer#footer__thirty .container-fluid .row1 {
    margin-bottom: 5%;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-4 {
    margin: 0;
    padding: 0;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-4 img {
    margin-top: 10%;
    width: 40%;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 {
    margin-top: 2.5%;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    text-decoration: none;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul li {
    margin-right: 5vw;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul li a {
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
  }
  footer#footer__thirty .container-fluid .row1 .col-sm-8 ul li a:hover {
    text-decoration: none;
    font-weight: 800;
    font-style: italic;
  }
  footer#footer__thirty .container-fluid .row2 .col1 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col1 ul li a {
    color: #fff;
    font-size: 1rem;
  }
  footer#footer__thirty .container-fluid .row2 .col1 ul li a:hover {
    text-decoration: none;
    font-weight: bold;
  }
  footer#footer__thirty .container-fluid .row2 .col2 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col2 ul li {
    font-size: 1rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col3 {
    padding: 0;
  }
  footer#footer__thirty .container-fluid .row2 .col3 h3 {
    font-size: 2rem;
    color: #fff;
  }
  footer#footer__thirty .container-fluid .row2 .col3 ul li a {
    font-size: 1rem;
    color: #292C6D;
  }
  footer#footer__thirty .container-fluid .row3 .col-sm-12 {
    color: #fff;
  }
  main #sosmed__side {
    position: fixed;
    width: 2.5vw;
    min-height: 20vh;
    top: 50%;
    left: 0;
    border-radius: 0 15px 15px 0;
    z-index: 999;
    background-color: #292C6D;
    text-align: center;
    overflow: hidden;
  }
  main #sosmed__side ul li {
    margin: 18% 0;
  }
  main #sosmed__side ul li a {
    font-size: 1.5rem;
    color: #FFFFFF;
  }
  main #sosmed__side ul li a img {
    width: 50%;
  }
  main #header__image {
    margin-top: -10vh;
    max-height: 100vh;
    overflow: hidden;
  }
  main #text__header__image {
    position: absolute;
    max-height: 100vh;
    width: 100%;
    top: 0;
    padding: 60vh 5vh 0;
  }
  main #text__header__image h1 {
    font-size: 5rem;
    color: #FFFFFF;
    font-weight: 600;
    line-height: 113px;
  }
  main #better__services {
    min-height: 100vh;
    overflow: hidden;
  }
  main #better__services .container .row .col-sm-12 h2 {
    margin-top: 10vh;
    font-size: 3.5rem;
    font-weight: 600;
    line-height: 5rem;
  }
  main #better__services .list__services {
    margin-top: 10vh;
  }
  main #better__services .list__services .row .col-sm-6 h3 {
    font-size: 2rem;
    font-weight: 600;
    line-height: 5rem;
  }
  main #better__services .list__services .row .col-sm-6 p {
    font-size: 1rem;
    line-height: 2rem;
  }
  main #better__services .list__services__ex .row .col-sm-12 {
    display: flex;
    flex-direction: row;
  }
  main #better__services .list__services__ex .row .col-sm-12 .text__ex {
    margin-top: 24.5vh;
    margin-left: 20vw;
    position: absolute;
    z-index: 2;
  }
  main #better__services .list__services__ex .row .col-sm-12 .text__ex h2 {
    font-size: 3.5rem;
    font-weight: 600;
    line-height: 5.5rem;
  }
  main #better__services .list__services__ex .row .col-sm-12 .image__ex {
    margin-top: 20vh;
    margin-left: 40vw;
    width: 60vw;
    height: 50vh;
    border-radius: 50px 0px 0px 50px;
    box-sizing: border-box;
    background-size: cover;
    overflow: hidden;
  }
  main #better__services .list__services__ex .row .col-sm-12 .image__ex img {
    background-repeat: repeat;
    background-size: cover;
    width: 100%;
    height: 500px;
  }
  main #better__services .list__services__bottom {
    height: 45vh;
    width: 100%;
    margin-top: 10vh;
  }
  main #better__services .list__services__bottom .row .col-sm-12 p {
    font-size: 1rem;
    line-height: 2.2rem;
  }
  main #what__todo {
    min-height: 100vh;
    padding: 20vh 10vw;
    overflow: hidden;
    background-color: #292C6D;
  }
  main #what__todo .container-fluid .row .col-sm-6 {
    padding-left: 5vw;
  }
  main #what__todo .container-fluid .row .col-sm-6 .img__slide__todo {
    position: relative;
    width: 28vw;
    height: 80vh;
    border-radius: 45px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
  }
  main #what__todo .container-fluid .row .col-sm-6 .img__slide__todo img {
    -o-object-fit: cover;
       object-fit: cover;
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
  }
  main #what__todo .container-fluid .row .col-sm-6 .img__slide__todo img.active {
    opacity: 1;
  }
  main #what__todo .container-fluid .row .col-sm-6 h2 {
    font-size: 3.5rem;
    font-weight: 600;
    color: #FFFFFF;
  }
  main #what__todo .container-fluid .row .col-sm-6 p {
    margin-top: 10vh;
    font-size: 1rem;
    line-height: 2rem;
    color: #FFFFFF;
  }
  main #what__todo .container-fluid .row .col-sm-6 .btn__lets__talk {
    font-size: 0.9rem;
    min-width: 8vw;
    min-height: 5vh;
    margin-top: 10vh;
    border-color: #FFFFFF;
    color: #FFFFFF;
    border-radius: 5px;
  }
  main #what__todo .container-fluid .row .col-sm-6 .btn__lets__talk:hover {
    background-color: #FFFFFF;
    color: #292C6D;
  }
  main #special {
    min-height: 100vh;
    overflow: hidden;
  }
  main #special .container .row1 .col-sm-12 {
    margin-top: 10vh;
    margin-bottom: 5vh;
  }
  main #special .container .row1 .col-sm-12 h2 {
    width: 50%;
    font-size: 3.5rem;
    font-weight: 600;
  }
  main #special .container .row1 .col-sm-12 p {
    padding-top: 5%;
    font-size: 1rem;
  }
  main #special .container .row2 .col2 {
    margin: 0;
  }
  main #special .container .row2 .col2 .mycard {
    position: relative;
    margin-bottom: 4%;
    margin-left: 2%;
    margin-right: 2%;
    padding-right: 0;
    width: 17vw;
    height: 30vh;
    border-radius: 20px;
    overflow: hidden;
  }
  main #special .container .row2 .col2 .mycard img {
    width: 100%;
    height: 100%;
    transition: filter 0.3s;
  }
  main #special .container .row2 .col2 .mycard:hover img {
    filter: blur(3px);
  }
  main #special .container .row2 .col2 .mycard:hover .mycard__text {
    opacity: 1;
  }
  main #special .container .row2 .col2 .mycard .mycard__text {
    position: absolute;
    top: 0;
    width: 17vw;
    height: 30vh;
    line-height: 30vh;
    text-align: center;
    opacity: 0;
    transition: opacity 0.3s;
  }
  main #special .container .row2 .col2 .mycard .mycard__text .btn-thirty {
    display: inline-block;
    width: 110%;
    padding: 10px 20px;
    background-color: #fff;
    color: #000;
    text-decoration: none;
  }
  main #special__slides {
    min-height: 100vh;
    overflow: hidden;
  }
  main #special__slides .container .row .col-sm-12 {
    margin-top: 10%;
    border-radius: 30px;
  }
  main #header__image__page {
    margin-top: -10vh;
    height: 100vh;
    overflow: hidden;
  }
  main #header__image__page .container-fluid .row .col-sm-12 {
    margin: 0;
    padding: 0;
  }
  main #header__image__page .container-fluid .row .col-sm-12 .container__image {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #header__image__page .container-fluid .row .col-sm-12 .container__image img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
  }
  main #text__header__image__page {
    position: absolute;
    max-height: 100vh;
    width: 100%;
    top: 0;
    padding: 35vh 30vh 0;
  }
  main #text__header__image__page h1 {
    width: 50%;
    font-size: 5rem;
    color: #292C6D;
    font-weight: 600;
    line-height: 100%;
  }
  main #about__description {
    padding-top: 5%;
  }
  main #about__description .container .row .col-sm-12 p {
    font-size: 1rem;
  }
  main #about__wwd {
    padding-top: 5%;
  }
  main #about__wwd .container .row .col-sm-12 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #about__wwd .container .row .col-sm-12 p {
    font-size: 1rem;
  }
  main #about__hwdi {
    padding-top: 5%;
  }
  main #about__hwdi .container .row .col-sm-12 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #about__hwdi .container .row .col-sm-12 p {
    font-size: 1rem;
  }
  main #about__special {
    padding-top: 5%;
  }
  main #about__special .container .row .col-sm-4 .container__image {
    height: 20vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #about__special .container .row .col-sm-4 .container__image img {
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  main #about__special .container .row .col-sm-4 h3 {
    margin-top: 15%;
    font-size: 1.8rem;
    color: #292C6D;
  }
  main #about__special .container .row .col-sm-4 p {
    font-size: 1.1rem;
  }
  main #about__awards {
    padding-top: 5%;
  }
  main #about__awards .container .row .col-sm-12 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #about__organization {
    min-height: 40vh;
    padding-top: 10%;
  }
  main #about__organization .container .row1 .col-sm-12 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #about__organization .container .row2 .col-sm-3 .container__image {
    width: 20vw;
    height: 25vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #about__organization .container .row2 .col-sm-3 .container__image img {
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  main #about__organization .container .row2 .col-sm-9 p {
    font-size: 1rem;
  }
  main #about__organization .container .row2 .col-sm-9 a {
    text-decoration: none;
    font-size: 1rem;
    color: #292C6D;
  }
  main #header__text__only {
    min-height: 100vh;
    overflow: hidden;
  }
  main #header__text__only .container-fluid {
    margin: 0;
    padding: 0;
  }
  main #header__text__only .container-fluid .row .col-sm-12 h2 {
    width: 60%;
    padding-top: 25vh;
    padding-left: 15%;
    font-size: 3.5rem;
    color: #292C6D;
  }
  main #header__text__only .container-fluid .row .col-sm-12 p {
    width: 90%;
    padding-left: 35%;
    padding-top: 5vh;
    font-size: 1rem;
  }
  main #services__card {
    min-height: 100vh;
  }
  main #services__card .container-fluid .row1 .col-sm-12 {
    padding: 5% 5%;
  }
  main #services__card .container-fluid .row1 .col-sm-12 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #services__card .container-fluid .row2 {
    padding: 0 5%;
  }
  main #services__card .container-fluid .row2 .col-sm-4 {
    margin-bottom: 5%;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services {
    width: 26vw;
    min-height: 70vh;
    padding: 20%;
    border-radius: 20px;
    overflow: hidden;
    background-color: #F6F6F6;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services .container__image {
    position: relative;
    width: 15vw;
    height: 15vh;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services .container__image img {
    -o-object-fit: cover;
       object-fit: cover;
    max-width: 100%;
    max-height: 100%;
  }
  main #services__card .container-fluid .row2 .col-sm-4 .mycard__services p {
    font-size: 1.2rem;
  }
  main #contact {
    min-height: 100vh;
    padding: 15% 5%;
  }
  main #contact .container-fluid .row .col1 {
    padding-right: 5%;
  }
  main #contact .container-fluid .row .col1 h2 {
    font-size: 2rem;
  }
  main #contact .container-fluid .row .col1 p {
    font-size: 1rem;
  }
  main #contact .container-fluid .row .col1 h4 {
    font-size: 1.4rem;
  }
  main #contact .container-fluid .row .col1 ul li a {
    text-decoration: none;
    color: #000;
    font-size: 1.2rem;
  }
  main #contact .container-fluid .row .col2 {
    padding-top: 5%;
  }
  main #contact .container-fluid .row .col2 .form-group .form-control {
    border-top: none;
    border-left: none;
    border-right: none;
  }
  main #contact .container-fluid .row .col2 .form-group .btn-send {
    width: 20vw;
    height: 7vh;
    font-size: 1rem;
    color: #000;
    background-color: #fff;
  }
  main #family {
    min-height: 100vh;
    padding: 10% 0;
  }
  main #family .container-fluid {
    margin: 0;
    padding: 0;
  }
  main #family .container-fluid .row1 .col-sm-12 {
    padding: 5% 10%;
  }
  main #family .container-fluid .row1 .col-sm-12 h2 {
    width: 30%;
    font-size: 3.5rem;
    color: #292C6D;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan {
    min-height: 40vh;
    width: 100%;
    padding: 10%;
    background-color: #292C6D;
    color: #fff;
    overflow: hidden;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan .title {
    font-size: 1.5rem;
    font-weight: 600;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan .subtitle {
    font-size: 1.3rem;
  }
  main #family .container-fluid .row2 .col-sm-4 #keterangan .desc {
    font-size: 1.2rem;
    margin-top: 2%;
  }
  main #family .container-fluid .row2 .col-sm-8 .card-deck .card {
    max-width: 20vw;
    cursor: pointer;
  }
  main #family .container-fluid .row2 .col-sm-8 .card-deck .card .card-image {
    width: 100%;
    height: 55vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #family .container-fluid .row2 .col-sm-8 .card-deck .card .card-image img {
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  main #header__values {
    margin-top: -10vh;
    height: 100vh;
    overflow: hidden;
    background-color: #292C6D;
    padding: 20% 20%;
  }
  main #header__values .container-fluid .row .col-sm-12 h2 {
    font-size: 3.5rem;
    color: #fff;
  }
  main #header__values .container-fluid .row .col-sm-12 p {
    font-size: 1rem;
    color: #fff;
  }
  main #section__value1 {
    min-height: 70vh;
    padding: 5%;
  }
  main #section__value1 .container .row .col-sm-12 {
    padding: 2% 0;
  }
  main #section__value1 .container .row .col-sm-12 .row .col-sm-3 h3 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #section__value1 .container .row .col-sm-12 .row .col-sm-9 p {
    width: 80%;
    font-size: 1rem;
  }
  main #garis__pletan {
    margin-top: -45%;
    margin-bottom: 10%;
    min-height: 70vh;
    width: 100%;
    overflow: hidden;
  }
  main #garis__pletan .container-fluid {
    margin: 0;
    padding: 0;
  }
  main #garis__pletan .container-fluid .row .col-sm-12 {
    display: flex;
    flex-direction: column;
    align-items: end;
  }
  main #garis__pletan .container-fluid .row .col-sm-12 .garis__plet {
    margin: 5% 0;
    width: 200px;
    height: 2px;
    background-color: #000;
  }
  main #section__value2 {
    min-height: 50vh;
    padding: 5%;
    overflow: hidden;
  }
  main #section__value2 .container .row .col-sm-12 h3 {
    margin-bottom: 5%;
    width: 50%;
    font-size: 2rem;
    color: #292C6D;
  }
  main #section__value2 .container .row .col-sm-12 p {
    padding-left: 30%;
    font-size: 1rem;
  }
  main #header__career {
    height: 100vh;
    overflow: hidden;
    padding: 20% 20%;
    border-bottom: 1px solid #000;
  }
  main #header__career .container-fluid .row .col-sm-12 h2 {
    font-size: 3.5rem;
    color: #292C6D;
  }
  main #header__career .container-fluid .row .col-sm-12 p {
    font-size: 1rem;
    color: #292C6D;
  }
  main #section__careers {
    min-height: 100vh;
    padding: 10% 5%;
  }
  main #section__careers .container-fluid .row1 {
    padding: 5% 2%;
  }
  main #section__careers .container-fluid .row1 .col-sm-4 h3 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #section__careers .container-fluid .row1 .col-sm-8 {
    font-size: 1rem;
  }
  main #section__careers .container-fluid .row2 {
    padding: 2%;
    border-top: 1px solid #000;
  }
  main #section__careers .container-fluid .row2 .col-sm-4 h2 {
    font-size: 2rem;
    color: #292C6D;
  }
  main #section__careers .container-fluid .row2 .col-sm-6 p {
    font-size: 1rem;
  }
  main #section__careers .container-fluid .row2 .col-sm-6 .btn-primary {
    margin-left: 80%;
    background-color: #292C6D;
  }
  main #header__podcast {
    margin-top: -10vh;
    height: 100vh;
    overflow: hidden;
  }
  main #header__podcast .container-fluid .row .col-sm-12 {
    margin: 0;
    padding: 0;
  }
  main #header__podcast .container-fluid .row .col-sm-12 .container__image {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  main #header__podcast .container-fluid .row .col-sm-12 .container__image img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
  }
  main #text__header__podcast {
    position: absolute;
    max-height: 100vh;
    width: 100%;
    top: 0;
    padding: 25vh 30vh;
  }
  main #text__header__podcast h1 {
    width: 70%;
    font-size: 5rem;
    color: #fff;
    font-weight: 600;
    line-height: 100%;
  }
  main #text__header__podcast p {
    width: 60%;
    font-size: 1rem;
    color: #fff;
  }
  main #text__header__podcast .btn-listen {
    background-color: rgba(255, 255, 255, 0.5);
    color: #ffffff;
    display: inline-block;
    padding: 10px 20px;
    text-decoration: none;
  }
  main #text__header__podcast .btn-listen img {
    vertical-align: middle;
    margin-left: 5px;
  }
  main #text__header__podcast .btn-listen:hover {
    background-color: rgba(255, 255, 255, 0.8);
  }
  main #podcast__section1 {
    min-height: 50vh;
    padding: 10% 2%;
    overflow: hidden;
  }
  main #podcast__section1 .container-fluid .row .col1 h3 {
    padding-left: 5%;
    width: 50%;
    color: #fff;
    font-size: 2rem;
  }
  main #podcast__section1 .container-fluid .row .col2 .row2 .col-sm-12 ul {
    display: inline-block;
    margin-right: 5px;
  }
  main #podcast__section1 .container-fluid .row .col2 .row2 .col-sm-12 ul li .line__kntl {
    width: 5vw;
    height: 1px;
    background-color: #fff;
  }
  main #podcast__section1 .container-fluid .row .col2 .row2 .col-sm-12 ul li a {
    font-size: 1rem;
    color: #fff;
  }
  main #podcast__section2 {
    min-height: 100vh;
    margin-bottom: 5%;
  }
  main #podcast__section2 .container .row1 .col-sm-12 h3 {
    font-size: 2rem;
    color: #fff;
  }
  main #podcast__section3 {
    min-height: 40vh;
    padding: 5% 0;
  }
  main #podcast__section3 .container .row .col1 h3 {
    font-size: 2rem;
    color: #fff;
  }
  main #podcast__section3 .container .row .col1 p {
    font-size: 1rem;
    color: #fff;
  }
  main #podcast__section3 .container .row .col2 {
    padding: auto;
  }
}/*# sourceMappingURL=style.css.map */