
  .news-title {
      font-size: 1.3em !important;
      line-height: 1.4;
      font-family: 'Itim', cursive;
      padding-top: 10px;
      display: -webkit-box;
      -webkit-line-clamp: 2;   /* jumlah baris */
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-overflow: ellipsis;
      min-height: 3.6em; /* tinggi minimum biar rata */
    }
    
  .image-shadow{
      border: 10px solid #fff;
      text-shadow: 2px 2px 5px red;
      box-shadow: 10px 10px 5px #ccc;
      -moz-box-shadow: 10px 10px 5px #ccc;
      -webkit-box-shadow: 10px 10px 5px #ccc;
      -khtml-box-shadow: 10px 10px 5px #ccc;
  }
/*
   .responsive {
      max-width: 100%;
      height: auto;
    }
    */
    .usman {
      margin-left: 30px;
      padding-top: 5px;
      text-align: center;
    }

    .lang-mob{
      display: none;
    }
    .lang-desk{
      display: block;
    }

    .buttoner {
      background-color: #4CAF50; /* Green */
      border: none;
      color: white;
      padding: 13px 28px;
      text-align: center;
      text-decoration: none;
      display: inline-block;
      font-size: 12px;
      margin: 4px 2px;
      transition-duration: 0.4s;
      cursor: pointer;
    }
    .button1 {
      background-color: white; 
      font-size: 12px;
      color: black; 
      border: 2px solid #01bdbc;
    }

    .button1:hover {
      background-color: #01bdbc;
      color: white;
    }

    .button2 {
      background-color: white; 
      font-size: 12px;
      color: black; 
      border: 2px solid #bd0101;
    }

    .button2:hover {
      background-color: #bd0101;
      color: white;
    }

    .button3 {
      background-color: white; 
      font-size: 12px;
      color: black; 
      border: 2px solid #fd7f03;
    }

    .button3:hover {
      background-color: #fd7f03;
      color: white;
    }





    .middle {
      transition: .5s ease;
      opacity: 0;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      text-align: center;
    }

    .imagena {
      display: block;
      width: 100%;
      height: auto;
    }

    .imagenaa {
      display: block;
      width: 348px;
      height: 302px;
    }

   .overlayna {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      background-color: rgba(34, 34, 34, 0.9);
      overflow: hidden;
      width: 100%;
      height: 0;
      transition: .5s ease;
      /*transition: opacity 0.3s;*/
    }

    .overlayimage {
      /*border-radius: 15px;*/
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      background-color: rgba(34, 34, 34, 0.9);
      overflow: hidden;
      width: 100%;
      height: 0;
      transition: .5s ease;
      /*transition: opacity 0.3s;*/
    }

    .shadowna:hover .overlayna  {
      height: 100%;
      opacity: 0.9;
    }

    .shadowimage:hover .overlayimage  {
      height: 100%;
      opacity: 0.9;
      border-radius: 15px;
    }

 

    .textna {
      color: white;
      font-size: 14px;
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      text-align: center;
    }

    .buttoners a{
      position: absolute;
      color: white !important;
      background-color: #06a4d4;
      z-index: 5;
      left: 0;
      bottom: 0;
      width: 100%;
      padding: 12px;
      text-align: center;
      transition: bottom 0.3s;
      font-weight: 600;
    }

    .imagesss{
          background-position: center !important;
          background-repeat: no-repeat !important;
          background-size: cover !important;
    }



    .float{
        position:fixed;
        width:50px;
        height:50px;
        bottom:30px;
        right:30px;
        background-color:#25d366;
        color:#FFF;
        border-radius:50px;
        text-align:center;
        font-size:30px;
        box-shadow: 2px 2px 3px #999;
        z-index:100;
      }

      .my-float{
        margin-top:13px;
      }

/*    @media only screen and (max-width: 600px) {
      .lang-mob {
        display: block;
        color: #263238;
      }
      .lang-desk{
        display: none;
      }
    }*/
    
    @media only screen and (max-width:600px) {
      .imgmobile{
        background-size: cover; 
        width:100%;
        display: block;
      }
      .imgdesktop{
        display: none;
        visibility:hidden
      }
      .desktop{
        display: none;
        visibility:hidden;
      }
      .mobile{
        display: block;
      }
      .imagenaa {
        display: block;
        width: 100%;
        height: 302px;
      }
      .check{
        display: none;
      }
      .image-article{
        width: 132px;
        padding-top: 10px;
      }
      .jpx-is-wrapper {
            display: block;
            margin: 0 auto;
            overflow: hidden;
            position: relative;
            z-index: 314749261;
            width: auto;
            height: 600px;
        }

        .jpx-is-wrapper>.jpx-is-container {
            background-color: transparent;
            border: 0;
            box-sizing: content-box;
            clip: rect(auto auto auto auto);
            color: black;
            left: 0;
            margin: 0 auto;
            overflow: visible;
            position: absolute;
            text-align: left;
            top: 0;
            visibility: visible;
            width: 100%;
            z-index: auto;
            height: 600px;
        }

        .jpx-is-wrapper>.jpx-is-container>.jpx-is-content {
            left: 0;
            overflow: hidden;
            right: 0;
            top: 0;
            visibility: visible;
            width: 100%;
            position: relative;
            height: 600px;
            display: block
        }

        .jpx-is-wrapper>.jpx-is-container>.jpx-is-content>.jpx-is-ad {
            -moz-box-shadow: rgba(0,0,0,0.65) 0 0 4px 2px;
            bottom: 10px;
            left: 0;
            margin: 0 auto;
            right: 0;
            text-align: center;
            height: 100% ;
            top: 62px;
            bottom: auto;
            -webkit-transform: translateZ(0);
            -moz-transform: translateZ(0);
            -ms-transform: translateZ(0);
            -o-transform: translateZ(0);
            transform: translateZ(0)
        }

        .jpx-position-fixed {
            position: fixed
        }

        .jpx-is-wrapper>.jpx-is-container>.jpx-is-content>.jpx-is-ad>.jpx-is-ad-frame {
            width: 100%;
            height: 100%
        }
        .butt {
            display: inline-block;
            border-radius: 4px;
            background-color: #01b6b6;
            border: none;
            color: #FFFFFF;
            text-align: center;
            font-size: 14px;
            padding: 5px;
            transition: all 0.5s;
            cursor: pointer;
            margin: 5px;
          }

          .butt span {
            cursor: pointer;
            display: inline-block;
            position: relative;
            transition: 0.5s;
          }

          .butt span:after {
            content: '\00bb';
            position: absolute;
            opacity: 0;
            top: 0;
            right: -20px;
            transition: 0.5s;
          }

          .butt:hover span {
            padding-right: 25px;
          }

          .butt:hover span:after {
            opacity: 1;
            right: 0;
          }
          .responsive {
            max-width: 100%;
            height: auto;
          }

          .partner {
            max-width: 80%;
            height: auto;
          }

          .responsenews {
            max-width: 90%;
            height: auto;
          }

          .response-img {
            max-width: 100%;
          }

          .image-user-icon{
            border-radius: 50%;
            width: 24px;
            height: 24px;
          }
    }

    @media only screen and (min-width: 600px) {
      .imgmobile{
        display: none;
        visibility:hidden
      }
      .imgdesktop{
        background-size: cover;
        width:100%;
        display: block;
      }

      .desktop{
        /*display: block;*/
      }
      .mobile{
        display: none;
        visibility:hidden;
      }
      .check{
        
      }
      .image-article{
        width: 200px;
      }
      .jpx-is-wrapper {
          display: block;
          margin: 0 auto;
          overflow: hidden;
          position: relative;
          z-index: 314749261;
          width: auto;
          height: 600px;
      }

      .jpx-is-wrapper>.jpx-is-container {
          background-color: transparent;
          border: 0;
          box-sizing: content-box;
          clip: rect(auto auto auto auto);
          color: black;
          left: 0;
          margin: 0 auto;
          overflow: visible;
          position: absolute;
          text-align: left;
          top: 0;
          visibility: visible;
          width: 100%;
          z-index: auto;
          height: 600px;
      }

      .jpx-is-wrapper>.jpx-is-container>.jpx-is-content {
          left: 0;
          overflow: hidden;
          right: 0;
          top: 0;
          visibility: visible;
          width: 100%;
          position: relative;
          height: 600px;
          display: block
      }

      .jpx-is-wrapper>.jpx-is-container>.jpx-is-content>.jpx-is-ad {
          -moz-box-shadow: rgba(0,0,0,0.65) 0 0 4px 2px;
          bottom: 10px;
          left: 0;
          margin: 0 auto;
          right: 0;
          text-align: center;
          height: 100% ;
          top: 62px;
          bottom: auto;
          -webkit-transform: translateZ(0);
          -moz-transform: translateZ(0);
          -ms-transform: translateZ(0);
          -o-transform: translateZ(0);
          transform: translateZ(0)
      }

      .jpx-position-fixed {
          position: fixed
      }

      .jpx-is-wrapper>.jpx-is-container>.jpx-is-content>.jpx-is-ad>.jpx-is-ad-frame {
          width: 100%;
          height: 100%
      }
      .butt {
        display: inline-block;
        border-radius: 4px;
        background-color: #01b6b6;
        border: none;
        color: #FFFFFF;
        text-align: center;
        font-size: 14px;
        padding: 5px;
        transition: all 0.5s;
        cursor: pointer;
        margin: 5px;
      }

      .butt span {
        cursor: pointer;
        display: inline-block;
        position: relative;
        transition: 0.5s;
      }

      .butt span:after {
        content: '\00bb';
        position: absolute;
        opacity: 0;
        top: 0;
        right: -20px;
        transition: 0.5s;
      }

      .butt:hover span {
        padding-right: 25px;
      }

      .butt:hover span:after {
        opacity: 1;
        right: 0;
      }

      .responsenews {
        max-width: 90%;
        height: 143px;
      }

      .response-img {
        max-width: 100%;
      }

      .image-user-icon{
        border-radius: 50%;
        width: 24px;
        height: 24px;
      }
    }



      .responsive {
        width: 100%;
        height: auto;
        z-index: 0;
      }

      .partner {
        width: 100%;
        height: auto;
        z-index: 0;
      }


    @media (min-width: 768px) {
      .imgmobile{
        display: none;
        visibility:hidden
      }
      .imgdesktop{
        background-size: cover;
        width:100%;
        display: block;
      }

      .desktop{
        margin-top: 55px;
        /*display: block;*/
      }
      .mobile{
        display: none;
        visibility:hidden;
      }

      .responsenews {
        max-width: 85%;
        height: 143px;
      }
      .response-img {
        max-width: 100%;
      }

      .image-user-icon{
        border-radius: 50%;
        width: 24px;
        height: 24px;
      }
    }

    a.link-hover{
      color: #312f2f;
    }

    a.link-hover:hover{
      color: #1f9db2;
    }

    #customers {
      font-family: Arial, Helvetica, sans-serif;
      border-collapse: collapse;
      width: 100%;
    }

    #customers td, #customers th {
      border: 1px solid #ddd;
      padding: 8px;
    }

    #customers tr:nth-child(even){background-color: #f2f2f2;}

    #customers tr:hover {background-color: #ddd;}

    .cont {
      padding-top: 12px;
      padding-bottom: 12px;
      text-align: left;
      background-color: #00c5c7;
      color: white;
    }

    .head{
      background-color: #ddd;   
      padding: 1px !important;         
    }

    .div-center {
      margin: auto;
    }

    .labelin-hijau{
      background-color: green;
      border: 0px solid #04AA6D;
      border-radius: 4px;
      color: white;
      font-size: 0.9em
    }
    .labelin-merah{
      background-color: red;
      border: 0px solid #04AA6D;
      border-radius: 4px;
      color: white;
      font-size: 0.9em
    }
    .labelin-kuning{
      background-color: yellow;
      border: 0px solid #04AA6D;
      border-radius: 4px;
      color: white;
      font-size: 0.9em
    }
    .labelin-awan{
      background-color: #17a8b5;
      border: 0px solid #04AA6D;
      border-radius: 4px;
      color: white;
      font-size: 0.9em
    }
    


