@font-face {
  font-family: 'Conv_Raleway-Medium';
  src: url('../fonts/Raleway-Medium.eot');
  src: local('☺'), url('../fonts/Raleway-Medium.woff') format('woff'), url('../fonts/Raleway-Medium.ttf') format('truetype'), url('../fonts/Raleway-Medium.svg') format('svg');
  font-weight: normal;
  font-style: normal;

  font-family: 'Conv_Palo_Alto_Regular';
  src: url('../fonts/Palo_Alto_Regular.eot');
  src: local('☺'), url('../fonts/Palo_Alto_Regular.woff') format('woff'), url('../fonts/Palo_Alto_Regular.ttf') format('truetype'), url('../fonts/Palo_Alto_Regular.svg') format('svg');
  font-weight: normal;
  font-style: normal;

  font-family: 'Conv_Raleway-Thin';
  src: url('../fonts/Raleway-Thin.eot');
  src: local('☺'), url('../fonts/Raleway-Thin.woff') format('woff'), url('../fonts/Raleway-Thin.ttf') format('truetype'), url('../fonts/Raleway-Thin.svg') format('svg');
  font-weight: normal;
  font-style: normal;

  font-family: 'Conv_Raleway-SemiBold';
  src: url('../fonts/Raleway-SemiBold.eot');
  src: local('☺'), url('../fonts/Raleway-SemiBold.woff') format('woff'), url('../fonts/Raleway-SemiBold.ttf') format('truetype'), url('../fonts/Raleway-SemiBold.svg') format('svg');
  font-weight: normal;
  font-style: normal;

  font-family: 'Conv_Palo_Alto_Oblique';
  src: url('../fonts/Palo_Alto_Oblique.eot');
  src: local('☺'), url('../fonts/Palo_Alto_Oblique.woff') format('woff'), url('../fonts/Palo_Alto_Oblique.ttf') format('truetype'), url('../fonts/Palo_Alto_Oblique.svg') format('svg');
  font-weight: normal;
  font-style: normal;

  font-family: 'Conv_Raleway-Regular';
  src: url('../fonts/Raleway-Regular.eot');
  src: local('☺'), url('../fonts/Raleway-Regular.woff') format('woff'), url('../fonts/Raleway-Regular.ttf') format('truetype'), url('../fonts/Raleway-Regular.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face { 
    font-family: 'Brandon Grotesque Medium'; 
    src: url('../fonts/brandon_grotesque_medium.eot'); 
    src: url('../fonts/brandon_grotesque_medium.eot?#iefix') format('embedded-opentype'),
    url('../fonts/brandon_grotesque_medium.svg#Brandon Grotesque Medium') format('svg'), 
    url('../fonts/brandon_grotesque_medium.woff') format('woff'), 
    url('../fonts/brandon_grotesque_medium.ttf') format('truetype'); 
    font-weight: normal; 
    font-style: normal;
}

@font-face {
  font-family: 'GothamBold';
  src: url('../fonts/GothamBold.eot?#iefix') format('embedded-opentype'), 
   url('../fonts/GothamBold.woff') format('woff'), url('../fonts/GothamBold.ttf')  format('truetype'), 
   url('../fonts/GothamBold.svg#fonts/GothamBold') format('svg');
  font-weight: normal;
  font-style: normal;
}


@font-face {
  font-family: 'GothamBook';
  src: url('../fonts/GothamBook.eot?#iefix') format('embedded-opentype'),  url('../fonts/GothamBook.woff') format('woff'), url('../fonts/GothamBook.ttf')  format('truetype'), url('../fonts/GothamBook.svg#fonts/GothamBook') format('svg');
  font-weight: normal;
  font-style: normal;
}


@font-face {
  font-family: 'GothamLight';
  src: url('../fonts/GothamLight.eot?#iefix') format('embedded-opentype'),  url('../fonts/GothamLight.woff') format('woff'), url('../fonts/GothamLight.ttf')  format('truetype'), url('../fonts/GothamLight.svg#fonts/GothamLight') format('svg');
  font-weight: normal;
  font-style: normal;
}


@font-face {
    font-family: 'GothamMedium';
    src: url('../fonts/GothamMedium.eot?#iefix') format('embedded-opentype'), 
    url('../fonts/GothamMedium.woff') format('woff'), url('../fonts/GothamMedium.ttf')  format('truetype'), 
    url('../fonts/GothamMedium.svg#fonts/GothamMedium') format('svg');
    font-weight: normal;
    font-style: normal;
}


@font-face {
  font-family: 'Raleway-Bold';
  src: url('../fonts/Raleway-Bold.eot?#iefix') format('embedded-opentype'),  
  url('../fonts/Raleway-Bold.otf')  format('opentype'),
    url('../fonts/Raleway-Bold.woff') format('woff'), 
    url('../fonts/Raleway-Bold.ttf')  format('truetype'), 
    url('../fonts/Raleway-Bold.svg#fonts/Raleway-Bold') format('svg');
  font-weight: normal;
  font-style: normal;
}


@font-face {
  font-family: 'Raleway-ExtraBold';
  src: url('../fonts/Raleway-ExtraBold.eot?#iefix') format('embedded-opentype'),
    url('../fonts/Raleway-ExtraBold.otf')  format('opentype'),
    url('../fonts/Raleway-ExtraBold.woff') format('woff'), 
    url('../fonts/Raleway-ExtraBold.ttf')  format('truetype'), 
    url('../fonts/Raleway-ExtraBold.svg#fonts/Raleway-ExtraBold') format('svg');
  font-weight: normal;
  font-style: normal;
}


@font-face {
  font-family: 'Raleway-Light';
  src: url('../fonts/Raleway-Light.eot?#iefix') format('embedded-opentype'), 
    url('../fonts/Raleway-Light.otf')  format('opentype'),
    url('../fonts/Raleway-Light.woff') format('woff'), 
    url('../fonts/Raleway-Light.ttf')  format('truetype'), 
    url('../fonts/Raleway-Light.svg#fonts/Raleway-Light') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'PaloAlto-Italic';
  src: url('../fonts/PaloAlto-Italic.eot?#iefix') format('embedded-opentype'), 
   url('../fonts/PaloAlto-Italic.woff') format('woff'), url('../fonts/PaloAlto-Italic.ttf')  format('truetype'), 
   url('../fonts/PaloAlto-Italic.svg#fonts/PaloAlto-Italic') format('svg');
  font-weight: normal;
  font-style: normal;
}

/*css fonts*/
.brandon{
    font-family: 'Brandon Grotesque Medium';  
}

.GothamBold{
    font-family: 'GothamBold';
}

.GothamBook{
    font-family: 'GothamBook';
}

.GothamLight{
    font-family: 'GothamLight';
}

.GothamMedium{
    font-family: 'GothamMedium';
}

.Raleway-Bold{
    font-family: 'Raleway-Bold';
  font-weight: bold;
}

.Raleway-ExtraBold{
    font-family: 'Raleway-ExtraBold';
}

.Raleway-Light{
    font-family: 'Raleway-Light';
}

.Raleway-Regular{
    font-family: 'Conv_Raleway-Regular';
}

.Raleway-SemiBold{
  font-family:'Conv_Raleway-SemiBold';
}

.Raleway-Medium{
  font-family:'Conv_Raleway-Medium';
}

.PaloAlto-Oblique{
  font-family : 'Conv_Palo_Alto_Oblique';
}

.PaloAlto-Italic{
    font-family: 'PaloAlto-Italic';
    font-weight: normal;
}
/*End fonts*/

/* Agent inti */
body{margin:0; padding:0; font-family: Conv_Raleway-Regular;}
.landing {background: rgba(77,157,211,1);background: -moz-linear-gradient(left, rgba(77,157,211,1) 0%, rgba(204,224,244,0.89) 49%, rgba(122,180,222,0.78) 100%);background: -webkit-gradient(left top, right top, color-stop(0%, rgba(77,157,211,1)), color-stop(49%, rgba(204,224,244,0.89)), color-stop(100%, rgba(122,180,222,0.78)));background: -webkit-linear-gradient(left, rgba(77,157,211,1) 0%, rgba(204,224,244,0.89) 49%, rgba(122,180,222,0.78) 100%);background: -o-linear-gradient(left, rgba(77,157,211,1) 0%, rgba(204,224,244,0.89) 49%, rgba(122,180,222,0.78) 100%);background: -ms-linear-gradient(left, rgba(77,157,211,1) 0%, rgba(204,224,244,0.89) 49%, rgba(122,180,222,0.78) 100%);background: linear-gradient(to right, rgba(77,157,211,1) 0%, rgba(204,224,244,0.89) 49%, rgba(122,180,222,0.78) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4d9dd3', endColorstr='#7ab4de', GradientType=1 );}
.stage {position: absolute;top: 0;left: 0;width: 100%;min-width: 900px;height: 1900px;overflow: hidden;z-index: 100;}
.container-landing{width: 1024px; margin-right: auto; margin-left: auto; position: relative; z-index: 102; height:1900px;}
.wraper{text-align: center; width: 100%;}
/* end */


/* css global */
.border{ border:1px solid #000;}
a{text-decoration: none;}
/* end */

/* moving awan */
.far-clouds {background: transparent url(../images/landing/cloud.png) 305px 110px repeat-x; position: absolute;}
.near-clouds {background: transparent url(../images/landing/cloud2a.png) 305px 240px repeat-x; position: absolute;}
.cloud2b {background: transparent url(../images/landing/cloud2b.png) 305px 270px repeat-x; position: absolute;}
.cloud3 {background: transparent url(../images/landing/cloud3.png) 305px 496px repeat-x; position: absolute;}
.cloud4 {background: transparent url(../images/landing/cloud4.png) 305px 656px repeat-x; position: absolute;}
.cloud5 {background: transparent url(../images/landing/cloud5.png) 305px 616px repeat-x; position: absolute;}
.cloud6 {background: transparent url(../images/landing/cloud6.png) 305px 816px repeat-x; position: absolute;}
.cloud7 {background: transparent url(../images/landing/cloud7.png) 305px 916px repeat-x; position: absolute;}
.cloud8 {background: transparent url(../images/landing/cloud5.png) 305px 856px repeat-x; position: absolute;}
.cloud9 {background: transparent url(../images/landing/cloud6.png) 305px 1016px repeat-x; position: absolute;}
.cloud10 {background: transparent url(../images/landing/cloud7.png) 305px 1116px repeat-x; position: absolute;}
.cloud11 {background: transparent url(../images/landing/cloud5.png) 305px 1056px repeat-x; position: absolute;}
.cloud12 {background: transparent url(../images/landing/cloud6.png) 305px 1216px repeat-x; position: absolute;}
/* end */


/* css header */
header nav{
  background: url(../images/bg-nav.png)repeat-x; 
  height: 23px; 
  clear: both; 
  padding: 4px 30px 0px 30px; 
  color:#fff;
  font-family:'Conv_Raleway-Regular'; 
  text-align: left;
  margin-right: auto; 
  margin-left: auto;
}
nav ul{
  text-transform: uppercase;
  margin-top: 4px;
  list-style-type: square;
  float: left; 
  padding: 0px;
}
nav ul li{
  float: left;
  font-size: 10px;
  margin: 0px 10px;
  width: auto;
}
nav ul li a, #lang a{
  text-decoration: none;
  color: #fff;
}
nav ul li a:hover, #lang a:hover{
  color: #7CBAED;
}
nav ul li:first-child {
  list-style-type: none;
}
#lang{
  font-size: 10px; 
  float: right;
  text-transform: uppercase;
  margin-top: 5px;
}
/* end */

#quote1{
  font-size: 18px;
  margin: 80px 0px;
  color: #fff;
  font-family:'Conv_Raleway-Regular';
  line-height: 20px; 
  letter-spacing: 1px;
}
#quote2{
  font-size: 28px;
  color: #fff;
  font-family:'Conv_Palo_Alto_Regular';
  line-height: 20px; 
  letter-spacing: 1px;
}

#tree{position: relative;}

#tree img{
  width: 680px;
}

#leave1{
  position: absolute;
  top: 280px;
  left: 230px;
}
#leave1 img{width: 170px;}

.mainContent{position: absolute;top: 0;left: 0;z-index: 101;}
.container{
  margin: 0 auto;
  width: 80%;
  height: auto;
  position: relative;
}

/*Page News List*/
/*
.content-first{
  width: 100%;
  height: 450px;
}
.content-first-first{
  width: 35%;
  height: 450px;
  float: left;
  background-color: white;
}
.content-first-second{
  width: 65%;
  height: 450px;
  float: left;
  background-color: #e1f4fc;
}
.coorporate .title{
  color: #006CB6;
  font-size: 14pt;
}
.coorporate .bar{
  background-color: #006CB6;
  height: 5px;
  width: 45px;
  margin-top: 10px;
}
.about-news{
  font-size: 12px;
  line-height: 15px;
  margin:0 auto;
  width: 80%;
}
.space{
  height: 100px;
  width: 100%;   
}
.space-1{
  height: 90px;
  width: 100%;   
}
.space-2{
  height: 190px;
  width: 100%;   
}
.space-3{
  height: 120px;
  width: 100%;   
}
.space-4{
  height: 80px;
  width: 100%;   
}
.space-5{
  height: 50px;
  width: 100%;   
}
.space-6{
  height: 20px;
  width: 100%;   
}
.content-second{
  height: auto;
  width: auto;
  float: left;
}
.content-second-first-blue{
  width: 35%;
  height: 250px;
  float: left;
  background-color: #e1f4fc;
  position: relative;
}
.content-second-first-white{
  width: 35%;
  height: 250px;
  float: left;
  background-color: white;
  position: relative;
}
.content-second-second{
  width: 65%;
  height: 250px;
  float: left;
  position: relative;
}
.loadMore{
  width: 100%;
  height: 40px;
  margin: 0 auto;
  text-align: center;
  float: left;
  color: #006CB6;
  font-size: 12px;
}
.content-second-first-blue img{
  padding-bottom: 10px;
}
.content-second-first-white img{
  padding-bottom: 10px;
}
.content-text{
  padding: 20px;
}
.content-text .title{
  width: 80%;
  font-size: 12px;
  color:  #006CB6;
}
.content-text .date{
  color: #6B6C6F;
  font-size: 10px;
  margin-bottom: 10px;
}
.content-text .text{
  font-size: 12px;
  color: #58595B;
  line-height: 15px;
}*/
/*end news*/

/* footer */
footer{background: #fff; width: 100%;}
footer .header-logo{
  
}
.separator-footer{height: 20px;width: 100%;background-color: #006CB6; clear: both;}
#footer-right{
  float: right;
  margin-top: 40px;
  width: 140px;
}
#footer-right #search{
  border: 1px solid lightgrey;
  border-radius: 3px;
  float: right;
  height: 15px;
  padding: 3px;
  width: 140px;
  -moz-border-radius:3px;
  -webkit-border-radius:3px;
  -o-border-radius:3px;
}
#footer-link{
  width: 100%;
  margin: 20px 0;
}
.footer-space{
  height: 30px;
  width: 100%;
}
.footer-space-2{
  height: 20px;
  width: 100%;
}
.footer span{
  color: #006CB6;
  font-size: 9px;
  letter-spacing:1px;
}
.footer-content-first{
  width: 65%;
  float: left;
  text-align: left;
  margin-top: 7px;
}
.footer-content-first img{
  margin-top:15px
}
.footer-content-second{
  width: 35%;
  float: left;
  padding: 0 0 15px;
  margin-top:-1px;
}
.search{
  border: 1px solid lightgrey;
  border-radius: 4px;
  color: #A5A7AA !important;
  letter-spacing:1px;
  float: right;
  height: 15px;
  padding: 3px;
  width: 185px !important;
  -moz-border-radius:4px;
  -webkit-border-radius:4px;
  -o-border-radius:4px;
}
#btn-search{
  width: 36px;
  height: 27px;
  float: right;
  margin-left: 10px;
  background: url(../images/btn-search.png);
  border: 0;
}
.back-footer{
  height: 20px;
  width: 100%;
  background-color: #006CB6;
}
.footer-content-second a{
  padding-left: 10px;
  float: right;
}
.footer-content-second a span{
  font-size: 9px;
  letter-spacing:1px;
}
.footer{
  width: 100%;
  margin: auto;
  padding: 25px 0 5px
}
/* footer */

/* Product */
#row{
  width: 100%;
  position: relative;
}
.row-01{
  left: 0;
  width: 50%;
  height: 387px;
  background-color: #b8dbe8;
  position: absolute;
  float: left;
}
.row-02{
  right: 0;
  width: 50%;
  height: 387px;
  background-color: #7aacc8;
  position: absolute;
  float: left;
}
.row-03{
  float: left;
  position: absolute; 
  left: 0px; 
  width: 50%; 
  background: #7aacc8; 
  height: 367px; 
  top: 387px;
}
.row-04{
  float: left; 
  position: absolute; 
  width: 50%; 
  right: 0px; 
  background: #b8dbe8; 
  height: 367px; 
  top: 387px;
}
.row-content{
  position: relative;
  width: 80%;
  height: 367px; 
  margin: 0 auto;
  color: white;
}
.row-content-01{
  width: 50%;
  float: left;
  height: 367px;
  position: absolute;
  left: 0;
  color: white;
}
.row-content-02{
  width: 50%;
  float: left;
  height: 367px;
  position: absolute;
  right: 0;
  color: white;
}
.row-content-title{
  padding-top: 35%;
  text-align: center;
}
.row-content-title a{
  color: white;
  font-size:24px;
}
#row-content01 .row-content-01 .row-content-title a:hover{
  color:#7aacc8;
}
#row-content01 .row-content-02 .row-content-title a:hover{
  color:#b8dbe8;
}
#row-content02 .row-content-01 .row-content-title a:hover{
  color:#b8dbe8;
}
#row-content02 .row-content-02 .row-content-title a:hover{
  color:#7aacc8;
}
.row-space{
  height: 20px;
  width: 100%;
}
.row-arrow{
  width: 100%;
  text-align: center;
}
.row-arrow a img:hover{
  opacity:0.8;
}
.row-arrow img{
  width: 36px;
  text-align: center;
}
.row-back {
  width:100%;
  text-align:right;
}
.row-back img{
  border-radius:4px;
  text-align: right;
}
.row-back a img:hover{
  opacity:0.8;
}
/* Product */

/* Product List */
.productlist-space{
  height: 40px;
  width: 100%;
}
.productlist-title{
  color: #006CB6;
  text-align: center;
  width: 100%;
  margin-bottom: 10px;
}
.productlist-bar{
  background-color: #006CB6;
  height: 5px;
  width: 50px;
  margin: 0 auto;
}
.productlist-list{
  width: 25%;
  /*width: 256px;*/
  height: 230px;
  float: left;
}
.productlist-list-image{
  text-align: center;
  margin: 0 auto;
  padding: 10px;
}
.productlist-list-image img{
  width: 100%;
  height: 100%;
}
.productlist-list-image a:hover img{
  opacity: 0.4;
  margin-top: -15px;
}
.productlist-list-title{
  text-align:center;
  width:100%;
  font-size:12px;
}
/* Product List */

/* Product Detail */
#row-detail{
  width: 100%;
  position: absolute;
}
.row-detail01{
  left: 0;
  width: 50%;
  height: 771px;
  background-color: white;
  position: relative;
  float: left;
  /*margin-top: -30px;*/
}
.row-detail02{
  right: 0;
  width: 50%;
  height: 771px;
  background-color: #daebee;
  position: relative;
  float: left;
  /*margin-top: -30px;*/
}
.row-detailcontent{
  position: relative;
  width: 80%;
  height: 771px; 
  /*border: 1px dotted grey;*/
  margin: 0 auto;
  color: white;
}
.row-detailcontent-01{
  width: 50%;
  float: left;
  height: 771px;
  position: absolute;
  left: 0;
  color: white;
}
.row-detailcontent-image{
  text-align: right;
  /*padding-top: 20%;*/
  width: 100%;
  height: 771px;
}
.row-detailcontent-image img{
  width: 100%;
  height: 771px
}
.row-detailcontent-02{
  width: 50%;
  float: left;
  height: 771px;
  position: absolute;
  right: 0;
  color: white;
}
.row-detailcontent-02 .row-detailcontent-text{
  color: #4D4D4F;
  padding-left: 10%;
  padding-top: 5%;
  padding-right: 5%;
  padding-bottom: 3%;
}
.row-detailcontent-02 .row-detailcontent-text .title{
  color:#006CB6;
}
.row-detailcontent-02 .row-detailcontent-text .bar{
  background-color: #006CB6;
  margin: 15px 5px;
  height: 5px;
  width: 50px;
}
.row-detailcontent-02 .row-detailcontent-text .subtitle{
  color: black;
}
.row-detailcontent-02 .row-detailcontent-text .text {
  font-size: 10px;
  max-height: 550px;
  overflow: auto;
  width:100%;
  line-height: 20px; 
  letter-spacing: 1px;
}
.row-detailcontent-02 .row-detailcontent-text .text p{
  margin-bottom: 0px;
  font-size: 10px;
  line-height: 20px; 
  letter-spacing: 1px;
}
.row-detailcontent-space{
  height: 10px;
  width: 100%;
}
/* Product Detail */

/* paggination */
.pagination{
  text-align: right;
  margin-top: 10px;
  width: 100%;
}
.page {
  display: inline-block;
  padding: 3px 9px 4px;
  margin-right: 4px;
  border-radius: 3px;
  border: solid 1px #c0c0c0;
  background: #e9e9e9;
  box-shadow: inset 0px 1px 0px rgba(255,255,255, .8), 0px 1px 3px rgba(0,0,0, .1);
  font-size: .875em;
  font-weight: bold;
  text-decoration: none;
  color: #717171;
  text-shadow: 0px 1px 0px rgba(255,255,255, 1);
}

.page:hover, .page.gradient:hover {
  background: #fefefe;
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FEFEFE), to(#f0f0f0));
  background: -moz-linear-gradient(0% 0% 270deg,#FEFEFE, #f0f0f0);
}

.page.active {
  border: none;
  background: #616161;
  box-shadow: inset 0px 0px 8px rgba(0,0,0, .5), 0px 1px 0px rgba(255,255,255, .8);
  color: #f0f0f0;
  text-shadow: 0px 0px 3px rgba(0,0,0, .5);
}

.page.gradient {
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f8f8f8), to(#e9e9e9));
  background: -moz-linear-gradient(0% 0% 270deg,#f8f8f8, #e9e9e9);
}
/* paggination */

/* Contact Us popup */
input[type="text"]{
  width: 97.5%;
  height: 20px;
  margin-bottom: 15px;
  color: #006CB6;
  padding-left: 5px;
  font-size: 10px;
}
textarea{
  width: 97.5%;
  height: 80px;
  margin-bottom: 15px;
  color: #006CB6;
  padding-left: 5px;
  font-size: 10px;
}
input[type="submit"],input[type="reset"]{
  border: none;
  background-color: #006CB6;
  color: white;
  padding: 7px 15px;
  font-weight: bold;
  font-size: 10px;

}
.img-scode{
  width: 100%;
}
.scode{
  width: 100px !important;
}
.popspace{
  height: 30px;
}
.popspace-01{
  height: 25px;
}
.close{
  padding: 20px 55px;
}
.close a{
  color: white !important;
  text-decoration: none;
  font-size: 11px;
}
.event{
  color: white;
  float: right;
  padding-right: 50px;
}
.keluhan{
  width: 185px;
  padding-right: 50px;
  text-align: right;
  color: white;
  float: right;
}

.box-alamat{
  color: white;
  float: right;
  text-align: right;
  font-size: 10px;
  bottom: 30px;
  position: absolute;
  letter-spacing: 1px;
  line-height: 15px;
  right: 50px;
}
/* Contact Us popup */

/* Contact Us */
.full-width{
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}

.content-contact{
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}

.box-contact{
  width: 100%;
  height: auto;
  background-color: #4d89b2;
  margin-top:-4px;
}

.box-contact-left{
  width: 30%;
  height: auto;
  background-color: #4d89b2;
  color: #ffffff;
  float: left;
}

.box-contact-right{
  width: 70%;
  height: auto;
  float: left;
  min-height: 800px;
}
.title-contact{
  color: #006CB6;
}
/* Contact Us */

/* About Us */
.desc-about{
  background-color: #e4f5fd;
  width: 100%;
  padding-bottom: 60px;

}
.back-about{
  background-color: #e4f5fd;
  width: 100%;
  height:40px;
  position:absolute;
}

.desc-box{
  width: 80%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 50px;
}
.image-box{
  width: 50%;
  float: left;
}

.image-box-image{
  width: 100%;  
}
.image-box-image img{
  width: 100%;
  height:100%;
}

#icon_desc{
  margin-bottom: 40px; 
}

#icon_desc img{
  width: 70px;
  float: left;
}

#icon_desc h3{
  float: left;
  margin-left : 30px;
  color: #006cb6;
  letter-spacing: 2px;
}

#desc-logo img{
  float: left;
  margin: 10px 5px 0px 0px;
  width:auto;
  height:61px;
}

.text-box{
  width: 50%;
  float: left;
  max-height: 533px;
  overflow: auto;
}

.text-box p{
  text-align: left;
  font-size: 12px;
  margin: 20px 0px 0px 25px;
  font-weight: normal !important ;
  letter-spacing: 1px;
  line-height: 20px;
}

.visi-misi{
  width: 80%;
  height: auto;
  position: absolute;
  top: 0px;
  margin-left: auto;
  margin-right: auto;
  left: 0;
  right: 0;
}

.abc{
  width: 23.3333%;
  float: left;
  min-height: 600px;
}

.visi-box{
  background-color: #eaf5f7;

}

.misi-box{
  background-color: #daecef;
}

.culture-box{
  background-color: #dfe4ea;
}

.icon img{
  height: 60px;
  margin: 40px 0px 30px 0px;
}

#icon-box{
  
}

#icon-box h3{
  margin: 0px;
}

#line img{
  height: 7px;
    width: 55px;
}

#line{
  margin: 10px 0px;
}

.text{
  font-size: 12px;
  line-height: 20px;
  letter-spacing: 1px;
  width: 90%;
  
}

.greetings{
  width: 100%;
}

.box-greetings{
  width: 80%;
  margin-left: auto;
  margin-right: auto;
}

.greetings-title{
  width: 40%;
  color: white;
  float: left;
}
.greetings-title h3{
  margin: 20px 0px; 
  letter-spacing: 2px; 
  line-height: 25px; 
  font-weight: 900;
}
.greetings-title img{
  width: 75px;
}
.greetings-desc{
  float: left;
  width: 60%;
  height: 510px;
  overflow: auto;
  margin-bottom: 50px;
}
.vision{
  width: 100%;
  height: 600px;
  position: relative;
  min-width: 80%;
}

.left-box{
  width: 50%;
  background-color: #eaf5f7; 
  height: 600px;
  float: left;
}

.right-box{
  width: 50%;
  background-color: #dfe4ea;
  height: 600px;
  float: left;
}

.full-width-visi-misi{
  width: 100%;
  height: auto;
}

#bottom_button{
  width: 95px;
  margin-left: auto;
  margin-right: auto;
  display: table;
  margin-bottom: 30px;
}

.greetings-desc p{
  font-size: 12px;
  line-height: 18px;
  letter-spacing: 1px;
  color: white;
}
.text-missiontext img{
  float: left;
  margin-left: -1%;
  padding-right: 5%;
  width: 5%;
}
.text-missiontext p{
  float:left;
  width:90%;
  margin-top:0px;
  margin-bottom: 10px;
  font-size:12px;
}
.text-culturetext img{
  float: left;
  margin-left: -1%;
  padding-right: 5%;
  width: 5%;

}
.text-culturetext p{
  float:left;
  width:88%;
  margin-bottom: 10px;
  margin-top:0px;
  font-size:12px;
}
.line-letter{
  line-height: 20px;
  letter-spacing: 2px;
  font-size: 22px;
}
/* About Us */

/* News */
#row-back-newsinfo{
  width:98%;
}
#news-detail{
  width: 100%;
  position: absolute;
}
.news-detail01{
  left: 0;
  width: 35%;
  height: 512px;
  background-color: white;
  position: relative;
  float: left;
  /*margin-top: -30px;*/
}
.news-detail02{
  right: 0;
  width: 65%;
  height: 512px;
  background-color: #e1f4fc;
  position: relative;
  float: left;
  /*margin-top: -30px;*/

}
.news-detailcontent{
  position: relative;
  width: 100%;
  height: 365px; 
  /*border: 1px dotted grey;*/
  margin: 0 auto;
  color: white;
}
.news-detailcontent-01{
  width: 31%;
  float: left;
  height: 365px;
  position: absolute;
  left: 0;
  color: white;
}
.news-detailcontent-02{
  width: 60%;
  float: left;
  height: 365px;
  position: absolute;
  right: 0;
  color: white;
}
.newscontent-first{
  width: 100%;
  height: auto;
}
.newscontent-first-first{
  width: 35%;
  height: 450px;
  float: left;
  background-color: white;
}
.newscontent-first-second{
  width: 65%;
  height: 450px;
  float: left;
  background-color: #e1f4fc;
}
.newscoorporate{
  padding-top: 15px;
}
.newscoorporate .newstitle{
  color: #006CB6;
  font-size: 15pt;
}
.newscoorporate .newsbar{
  background-color: #006CB6;
  height: 5px;
  width: 53px;
  margin-top: 10px;
}
.about-news{
  font-size: 12px;
  line-height: 15px;
  margin:0 auto;
  width: 80%;
  color: #006CB6;
}
.newsspace{
  height: 60px;
  width: 100%;   
}
.newsspace-1{
  height: 90px;
  width: 100%;   
}
.newsspace-2{
  height: 190px;
  width: 100%;   
}
.newsspace-3{
  height: 120px;
  width: 100%;   
}
.newsspace-4{
  height: 80px;
  width: 100%;   
}
.newsspace-5{
  height: 50px;
  width: 100%;   
}
.newsspace-6{
  height: 25px;
  width: 100%;   
}
.content-second{
  height: auto;
  width: auto;
  float: left;
}
.content-second-first-blue{
  width: 100%;
  height: 286px;
  float: left;
  background-color: #e1f4fc;
  position: relative;
}
.content-second-first-white{
  width: 100%;
  height: 286px;
  float: left;
  background-color: white;
  position: relative;
}
.content-second-second{
  width: 65%;
  height: 250px;
  float: left;
  position: relative;
}
.loadMore{
  width: 100%;
  height: 40px;
  margin: 0 auto;
  text-align: center;
  float: left;
  color: #006CB6;
  font-size: 10px;
}
.newscontent-text{
  padding-top: 20px;
  padding-bottom: 20px;
  padding-right: 40px;
  padding-left: 0px;
}
.newscontent-text .newstitle{
  width: 80%;
  font-size: 12px;
  color:  #006CB6;
}
.newscontent-text .newstitle a{
  text-decoration: none;
  color: #006CB6;
}
.newscontent-text .newstitle a:hover{
  color: #58595B;
}
.newscontent-text a img{
  margin-bottom:10px;
}
.newscontent-text a img:hover{
  opacity: 0.9;
}
.newscontent-text .newsdate{
  color: #6B6C6F;
  font-size: 10px;
  margin-bottom: 10px;
}
.newscontent-text .newstext{
  font-size: 12px;
  color: #58595B;
  line-height: 15px;
  max-height: 80px;
  overflow: auto;
  letter-spacing: 1px;
}
.loadMore a{
  text-decoration: none;
}
.loadMore a img{
  margin-bottom:4px;
}
.box-blue{
  width: 25%;
  margin-left: 10%;
  height: 286px;
  float: left;
}
.box-white{
  width: 25%;
  margin-left: 10%;
  height: 286px;
  float: left;
}
.box-image{
  width: 65%;
  height: 286px;
  float: left;
}
.box-image img{
  width: 100%;
  height: 100%;
}
/* News */

/* Social */

#social-detail{
  width: 100%;
  position: absolute;
}
.social-detail01{
  left: 0;
  width: 35%;
  height: 512px;
  background-color: white;
  position: relative;
  float: left;
  /*margin-top: -30px;*/
}
.social-detail02{
  right: 0;
  width: 65%;
  height: 512px;
  background-color: #e1f4fc;
  position: relative;
  float: left;
  /*margin-top: -30px;*/

}
.social-detailcontent{
  position: relative;
  width: 100%;
  height: 485px; 
  /*border: 1px dotted grey;*/
  margin: 0 auto;
  color: white;
}
.social-detailcontent-01{
  width: 31%;
  float: left;
  height: 485px;
  position: absolute;
  left: 0;
  color: white;
}
.social-detailcontent-02{
  width: 69%;
  float: left;
  height: 485px;
  position: absolute;
  right: 0;
  color: white;
}
.socialspace{
  height: 50px;
  width: 100%;   
}
.socialresponsibility{
  padding-top: 15px;
}
.about-social{
  font-size: 12px;
  line-height: 15px;
  margin:0 auto;
  width: 95%;
  color: #006CB6;
  height: 375px;
  overflow: auto;
}
.socialresponsibility .socialtitle{
  color: #006CB6;
  font-size: 14pt;
}
.socialresponsibility .socialbar{
  background-color: #006CB6;
  height: 5px;
  width: 45px;
  margin-top: 10px;
}
.content-social{
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}

.icon-social img{
  width: 50px;
  margin-top: 10px;
  margin-bottom: 30px;
}

.title-social h3{
  margin: 10px 0px;
}

.title-social img{
  width: 50px;
}

.content-left-social{
  width: 35%;
  float: left;
}
.content-right-social{
  width: 65%;
  float: left;
  border: 1px solid auto;
  background-color: #dff2f9;
}

.content-image-social{
  width: 100%;
}

.box-image-social{
  width: 100%;
}

#img-social img{
  width: 100%;
}

.content-desc-social p{
  font-size: 10px;
  letter-spacing: 1px;
  line-height: 15px;
}
.ctitle{
  margin-top: 20px;
  margin-bottom: 0px; 
}
.stitle{
  margin-top: 0px;
  margin-bottom: 20px;
}
.content-desc-social p b{
  font-size: 11px;
  letter-spacing: 1px;
  line-height: 15px;
}

#press-overlay{
  display: none;
  color: #666;
  font-size: 11px;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background: rgba(40,35,36, 0.80);
  text-align: inherit;
}

.box-img-social{
  margin-bottom: -4px;
  width: 33.33%;
}

.img-social{
  width: 100%;
}
/* Social */

/* Social Detail */
#sosdetail-detail{
  width: 100%;
  position: absolute;
}
.sosdetail-detail01{
  left: 0;
  width: 60%;
  height: 682px;
  background-color: white;
  position: relative;
  float: left;
  /*margin-top: -30px;*/
}
.sosdetail-detail02{
  right: 0;
  width: 40%;
  height: 679px;
  background-color: #E8F4ED;
  position: relative;
  float: left;
  /*margin-top: -30px;*/

}
.detailcontent-first{
  width: 60%;
  float: left;
  height: 652px;
  margin-top: -10px;
}
.detailcontent-second{
  width: 30%;
  margin-right: 10%;
  float: left;
  background-color: #e8f4ed;
  height: 652px;
  margin-top: -8px;
}
.detailcontent-second-content{
  padding: 40px 20px 0px 40px;
  position: relative;
}
.socialdetail-title{
  color: #c0c2c4;
  float: left;
  padding: 2px;
  width: 80%;
}
.sosdetailtitle{
  color: #006CB6;
  font-size: 14px;
}
.sosdetaildate{
  font-size: 10px;
  color: #006CB6;
  padding-top: 20px;
  line-height: 20px; 
  letter-spacing: 1px;
}
.sosdetailtext{
  font-size: 12px;
  line-height: 15px;
  overflow-y: auto;
  max-height: 360px;
  width: 100%;
  line-height: 20px; 
  letter-spacing: 1px;
}
.sosdetailtext p {
  font-size: 12px;
  line-height: 15px;
  line-height: 20px; 
  letter-spacing: 1px;
}
.sosdetailspace{
  height: 40px;
  width: 100%;
}
/* Social Detail */

/* Health & News Page */
 .health-news-content{
  width: 100%;
  height: auto;
  margin-top: -5px;
}
.health-news-content-1{
  width: 70%;
  height: auto;
  float: left;
}
.health-news-content-1 h4{
  color: #006CB6;
}
.health-news-content-2{
  width: 30%;
  height: auto;
  float: left;
  background-color: #e0f3fc;
}
.health-news-space-bar{
  width: 50px;
  height: 5px;
  background-color: #006CB6;
}
.health-news-space-1{
  width: 100%;
  height: 25px;
}
.health-news-space-2{
  width: 100%;
  height: 10px;
}
.d-time{
  font-size: 10px;
  color: #757679;
  padding-bottom: 5px;
}
.written{
  font-size: 10px;
  padding-bottom: 5px;
  color: #757679;
}
.health-news-conteks p{
  font-size: 14px;
}
.health-news-conteks{
  width: 95%;
  font-size: 14px;
  padding-right: 10px;
  letter-spacing: 1px;
  line-height: 20px;

}
.health-news-related{
  width: 60%;
  margin: 0 auto;
}
.health-news-related .health-news-related-title{
  background-color: #006CB6;
  margin: 0 auto;
  text-align: center;
  color: white;
  font-size: 12px;
  letter-spacing: 2px;
  margin-bottom: 20px;
  height: 30px;
}
.health-news-related .health-news-related-title p{
  padding: 7px;
}
.health-news-related .health-news-related-post{
  width: 100%;
  height: 80%;
}
.health-news-related-pos-img{
  width:100%;
  height:120px;
}
.health-news-related-pos-img img{
  width:100%;
  height:100%;
}
.health-news-related .health-news-related-post .health-news-title{
  font-size: 12px;
  width: 100%;
  margin-top: 10px;
  margin-bottom: 20px;
  color:#006CB6;  
}
.health-news-related-post a:hover{
  opacity: 0.7;
}
.health-news-image img{
  width: 100%;
  margin-top: -10px;
}
/* Health & News Page */

/* Login */
#login{
  width:1024px;
  margin: 0 auto;
}
.form-login{
  width: 400px;
  height: 300px;
  margin: 0 auto;
  padding-top: 15%;
}
.title-login{
  font-size: 24px;
  color: #006CB6;
}
.loginspace{
  height: 20px;
}

/*mobile menu*/
  .header-mobile{
    background: rgb(79,133,187); /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRmODViYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM0Zjg1YmIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, rgba(79,133,187,1) 0%, rgba(79,133,187,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(79,133,187,1)), color-stop(100%,rgba(79,133,187,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(79,133,187,1) 0%,rgba(79,133,187,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(79,133,187,1) 0%,rgba(79,133,187,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(79,133,187,1) 0%,rgba(79,133,187,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(79,133,187,1) 0%,rgba(79,133,187,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4f85bb', endColorstr='#4f85bb',GradientType=0 ); /* IE6-8 */
    padding-bottom: 10px; 
    display:none;
  }

  #bahasa{
    background: #006CB6; 
    padding: 1% 3%;
  }

  .img-mobile{
    
    margin-top: 2%;
    float: left;
    width: 5%;
    margin-left: 3%;
    position: absolute;
    width: 30px;
    background: rgba(255,255,255,0.3);
    border-radius: 2px;
  }

  .header-mobile h4{
    color: #fff; 
    float: right; 
    margin: 5% 3% 0 0;
  }

  .menu-mobile{
    background: rgb(79,133,187); /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRmODViYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM0Zjg1YmIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, rgba(79,133,187,1) 0%, rgba(79,133,187,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(79,133,187,1)), color-stop(100%,rgba(79,133,187,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(79,133,187,1) 0%,rgba(79,133,187,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(79,133,187,1) 0%,rgba(79,133,187,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(79,133,187,1) 0%,rgba(79,133,187,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(79,133,187,1) 0%,rgba(79,133,187,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4f85bb', endColorstr='#4f85bb',GradientType=0 ); /* IE6-8 */
  }

  .menu-mobile ul{
    padding: 0;
    margin: 0;
    list-style: none;
    
  }

  .menu-mobile ul li {
    padding-top: 10px;
    border-bottom: 1px solid rgba( 255, 255, 255, 0.1 );
    padding-left: 3%;
    padding-bottom: 10px;
  }

  .menu-mobile ul li:after{
    border-bottom: 1px solid rgba( 0, 0, 0, 0.4 );
  }

  .menu-mobile ul li a{
    color: #fff;
  }

  /*end mobile*/

/* Login */
@media screen and (max-width:339px) {
  /*modal*/
  .close{
    padding:  0px !important;
  }

  .close span{
    font-size: 11px !important;
    font-weight: bold;
  }

  #modal-feed:target{
    top: 10% !important;
  }

  #modal-feed {
    width: 90% !important;

  }

  #modal-feed .copy {
    width: 87% !important;
  }

  #need{
    margin-right: 20px !important;
  }

  #modal-feed .content-title{
    display: none !important;
  }

  #modal:target{
    top: 10% !important;
  }

  #modal{
    width: 90% !important;
  }

  #modal .copy{
    width: 87% !important;
  }

  #modal .content-title{
    display: none !important;
  }

  #close-mobile{
    display: block !important;
  }

  /*end modal*/
  .container{
    width:100%;
  }
  header nav{
    padding:4px 15px 0px 5px;
  }
  #lang{
    margin-top:4px;
  }
  footer {
    background: #fff;
    width: 95%;
    margin: 0 auto;
  }
  .footer{
    height: 200px;
    padding:0;
  }
  .footer-content-first{
    width: 95%;
    position: relative;
    top: 120px;
    text-align: center;
  }
  .footer-content-first img{
    margin-top:0 !important;
    width: 100%;
  }
  .footer-content-second{
    width: 100%;
    text-align: center;
  }
  .footer .search{
    width: 80% !important;
  }
  .footer-content-second a {
    padding-left: 10px;
    float: none;
    text-align: center;
  }
  .news-detailcontent-01{
    padding-left: 3%;
    width: 97%;
    position: relative;
  }
  .news-detailcontent-02{
    position: relative;
    width:100%;
    border-bottom: 1px solid white;
    height:512px;
  }
  .content-second-first-blue{
    width:100%;
    height:auto;
  }
  .content-second-first-white{
    width:100%;
    height:auto;
  }
  .box-blue{
    width: 94%;
    margin: 0% 3% 0 3%;
  }
  .box-white{
    width: 94%;
    margin: 0% 3% 0 3%;
  }
  .box-image{
    width:100%;
  }
  .health-news-content-1{
    width: 90%;
    height: auto;
    float: left;
    padding-left: 5%;
    padding-right: 5%;
  }
  .health-news-content-2{
    width:100%;
  }
  .health-news-related-pos-img{
    height:120px;
  }
  .news-detail01{
    width:100%;
    position:relative;
  }
  .news-detail02{
    width:100%;
    position:relative;
  }
  .news-detailcontent{
    height:512px;
  }
  .row-content{
    width:100%;
    height: 273px;
  }
  .row-content-01{
    height: 273px;
    width:100%;
    position:relative;
  }
  .row-content-title {
    padding-top: 30%;
  }
  .row-content-02{
    height: 273px;
    width:100%;
    position:relative;
  }
  #row-content01 .row-content-01{
    background-color:#b8dbe8;
  }
  #row-content01 .row-content-02{
    background-color:#7aacc8;
  }
  #row-content02 .row-content-01{
    background-color:#7aacc8;
  }
  #row-content02 .row-content-02{
    background-color:#b8dbe8;
  }
  .productlist-list{
    width:100%;
  }
  .row-01{
    height:300px;
    display:none;
  }
  .row-02{
    height:300px;
    display:none;
  }
  .row-03{
    height:273px;
    top:300px;
    display:none;
  } 
  .row-04{
    height:273px;
    top:300px;
    display:none;
  }
  .row-back img{
    width:50%;
  }
  .row-detail01{
    width:100%;
  }
  .row-detail02{
    width:100%;
    height:810px;
  }
  .row-detailcontent{
    width:100%;
  }
  .row-detailcontent-01{
    width:100%;
    position:relative;
  }
  .row-detailcontent-02{
    width:100%;
    position:relative;
    z-index: 1000;
  }
  .row-back{
    width:99%;
    padding-bottom: 10px;
  }
  #row-back{
    width:100%;
  }
  .social-detail01{
    width:100%;
  }
  .social-detail02{
    width:100%;
    height: 520px;
  }
  .social-detailcontent-01{
    width: 97%;
    padding-left: 3%;
    position:relative;
  }
  .social-detailcontent-02{
    width:100%;
    position:relative;
  }
  .box-img-social{
    width:100%;
  }
  #press-overlay span h2{
    font-size:10px;
  }
  #press-overlay span div{
    font-size:10px;
  }
  .detailcontent-first{
    margin-top:-8px;
    width:100%;
  }
  .detailcontent-second{
    width:100%;
    height:450px;
  }
  .image-box{
    width: 100%;
  }
  .text-box{
    width: 100%;
  }
  .text-box p{
    padding:20px 0px 0px 0px !important;
    margin:0px;
  }
  .desc-box {
    width: 95%;
  }
  .box-greetings{
    width: 95%;
  }
  .left-box, .right-box{
    position:absolute;
  }
  .visi-box{
    height:350px !important;
  }
  .visi-misi {
    width: 100%;
    height: auto;
    position: relative;
    top: 0px;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
  }
  .abc{
    width: 90% !important;
    height: auto;
    padding: 0% 5% 0% 5%;
    min-height:300px;
  }
  .misi-box{
    height: 700px !important;
  }
  .text-missiontext img {
    float: left;
    margin-left: -0.5%;
    padding-right: 5%;
    width: 3%;
  }
  .text-missiontext p {
    float: left;
    width: 92%;
    margin-top: 0px;
    margin-bottom: 10px;
    font-size: 12px;
  }
  .culture-box{
    height:700px !important;
  }
  .text-culturetext img{
    float: left;
    margin-left: -0.5%;
    padding-right: 5%;
    width: 3%;
  }
  .text-culturetext p{
    float: left;
    width: 92%;
    margin-top: 0px;
    margin-bottom: 10px;
    font-size: 12px;
  }
  #bottom_button{
    width:65px;
  }
  .greetings-title{
    width:100%;
  }
  .greetings-desc{
    width:100%;
    max-height:300px;
    overflow:auto;
  }
  .productlist-list{
    height:auto;
  }
  .detailcontent-second{
    height:650px;
  }
  .box-contact-left{
    width:100%;
  }
  .box-contact-right{
    width:100%;
  }
  #modal-feed{
    width: 95%;
  }

  #modal{
    width: 95%;
  }

  .close{
    padding: 20px 10px;
  }

  .event{
    padding-right: 10px;
  }

  .keluhan{
    padding-right: 10px;
  }

  .box-alamat{
    right: 10px;
  }

  #modal-feed .copy {
    width: 50%;
  }

  #modal .copy{
    width: 50%;
  }

  #modal-feed .content-title {
    width: 37%;
  }

  #modal .content-title{
    width: 37%;
  }

  #jk{
    padding-right: 140px;
  }
  .newscontent-text{ 
    padding-left:0;
    padding-right:0;
    padding-bottom:0;
    padding-top:20px;
  }
  .newscoorporate .newstitle{
    font-size: 12pt;
  }
  .about-news{
    max-height: 400px;
    overflow: auto;
    width:90%;
  }

  /*mobile*/
  .header-mobile{
    display: block !important;
  }

  .menu{
    display: none !important;
  }

  .health-news-image img{
    margin-top: 0px;
  }

  .skdslider{
    top: 0px !important;
  }

  .detailcontent-first{
    margin-top: 0px !important;
  }

  /*end*/

  /*slider*/
  .skdslider{
    height: 350px !important;
  }

  .skdslider ul.slides-studio li{
    height: 350px !important;
  }

  .skdslider ul.slides-studio li img{
    height: 350px !important;
  }
  
  /*end*/
}
@media screen and (min-width:340px) and (max-width:639px) {
  .newscoorporate .newstitle{
    font-size:12pt;
  }
  .box-img-social{
    width:50%;
  }
  .about-news{
    max-height: 200px;
    overflow: auto;
  }
  .container{
    width:100%;
  }
  header nav{
    padding:4px 15px 0px 5px;
  }
  #lang{
    margin-top:4px;
  }
  footer {
    background: #fff;
    width: 95%;
    margin: 0 auto;
  }
  .footer{
    height: 200px;
    padding:0;
  }
  .footer-content-first{
    width: 95%;
    position: relative;
    top: 115px;
    text-align: center;
  }
  .footer-content-first img{
    margin-top:0 !important;
    width: 70%;
  }
  .footer-content-second{
    width: 100%;
    text-align: center;
  }
  .footer .search{
    width: 87% !important;
  }
  .footer-content-second a {
    padding-left: 10px;
    float: none;
    text-align: center;
  }
  .news-detailcontent-01{
    padding-left:3%;
    width:32%;
  }
  .news-detailcontent-02{
    width:65%;
  }
  .content-second-first-blue{
    width:100%;
    height:auto;
  }
  .content-second-first-white{
    width:100%;
    height:auto;
  }
  .box-blue{
    width: 94%;
    margin: 0% 3% 0 3%;
  }
  .box-white{
    width: 94%;
    margin: 0% 3% 0 3%;
  }
  .box-image{
    width:100%;
  }
  .health-news-content-1{
    width: 90%;
    height: auto;
    float: left;
    padding-left: 5%;
    padding-right: 5%;
  }
  .health-news-content-2{
    width:100%;
  }
  .health-news-related-pos-img{
    height:200px;
  }
  .row-content{
    width:100%;
    height: 273px;
  }
  .row-content-01{
    height: 273px;
    width:100%;
    position:relative;
  }
  .row-content-title {
    padding-top: 20%;
  }
  .row-content-02{
    height: 273px;
    width:100%;
    position:relative;
  }
  #row-content01 .row-content-01{
    background-color:#b8dbe8;
  }
  #row-content01 .row-content-02{
    background-color:#7aacc8;
  }
  #row-content02 .row-content-01{
    background-color:#7aacc8;
  }
  #row-content02 .row-content-02{
    background-color:#b8dbe8;
  }
  .productlist-list{
    width:50%;
  }
  .row-01{
    height:300px;
    display:none;
  }
  .row-02{
    height:300px;
    display:none;
  }
  .row-03{
    height:273px;
    top:300px;
    display:none;
  } 
  .row-04{
    height:273px;
    top:300px;
    display:none;
  }
  .row-back img{
    width:25%;
  }
  .row-detail01{
    width:100%;
  }
  .row-detail02{
    width:100%;
  }
  .row-detailcontent{
    width:100%;
  }
  .row-detailcontent-01{
    width:100%;
    position:relative;
  }
  .row-detailcontent-02{
    width:100%;
    position:relative;
    z-index: 1000;
  }
  .row-back{
    width:99%;
    margin-bottom: 10px;
  }
  .row-back img{
    width:35%;
  }
  #row-back{
    width: 95%;
  }
  .social-detail01{
    width:40%;
  }
  .social-detail02{
    width:60%;
  }
  .social-detailcontent-01{
    width:37%;
    padding-left:3%;
  }
  .social-detailcontent-02{
    width:60%;
  }
  #press-overlay span h2{
    font-size:10px;
  }
  #press-overlay span div{
    font-size:10px;
  }
  .detailcontent-first{
    width:100%;
  }
  .detailcontent-second{
    width:100%;
    height:450px;
  }
  .image-box{
    width: 100%;
  }
  .text-box{
    width: 100%;
  }
  .text-box p{
    padding:20px 0px 0px 0px !important;
    margin:0px;
  }
  .desc-box {
    width: 95%;
  }
  .box-greetings{
    width: 95%;
  }
  .left-box, .right-box{
    position:absolute;
  }
  .visi-box{
    height:350px !important;
  }
  .visi-misi {
    width: 100%;
    height: auto;
    position: relative;
    top: 0px;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
  }
  .abc{
    width: 90% !important;
    height: auto;
    padding: 0% 5% 0% 5%;
    min-height:300px;
  }
  .misi-box{
    height: 500px !important;
  }
  .text-missiontext img {
    float: left;
    margin-left: -0.5%;
    padding-right: 5%;
    width: 3%;
  }
  .text-missiontext p {
    float: left;
    width: 92%;
    margin-top: 0px;
    margin-bottom: 10px;
    font-size: 12px;
  }
  .culture-box{
    height:500px !important;
  }
  .text-culturetext img{
    float: left;
    margin-left: -0.5%;
    padding-right: 5%;
    width: 3%;
  }
  .text-culturetext p{
    float: left;
    width: 92%;
    margin-top: 0px;
    margin-bottom: 10px;
    font-size: 12px;
  }
  #bottom_button{
    width:65px;
  }
  .greetings-title{
    width:100%;
  }
  .greetings-desc{
    width:100%;
    max-height:300px;
    overflow:auto;
  }
  .productlist-list{
    height:auto;
  }
  .detailcontent-second{
    height:550px;
  }
  .box-contact-left{
    width:100%;
  }
  .box-contact-right{
    width:100%;
  }
  #modal-feed{
    width: 90% !important;
  }

  #modal{
    width: 90% !important;
  }

  .close{
    padding: 20px 10px;
  }

  .event{
    padding-right: 10px;
  }

  .keluhan{
    padding-right: 10px;
  }

  .box-alamat{
    right: 10px;
  }

  #modal-feed .copy {
    width: 50%;
  }

  #modal .copy{
    width: 50%;
  }

  #modal-feed .content-title {
    width: 37%;
  }

  #modal .content-title{
    width: 37%;
  }

  #jk{
    padding-right: 140px;
  }

  /*mobile*/
  .header-mobile{
    display: block !important;
  }

  .menu{
    display: none !important;
  }

  .health-news-image img{
    margin-top: 0px;
  }

  .skdslider{
    top: 0px !important;
  }

  .detailcontent-first{
    margin-top: 0px !important;
  }
  /*end*/

  /*slider*/
  .skdslider{
    height: 400px !important;
  }

  .skdslider ul.slides-studio li{
    height: 400px !important;
  }

  .skdslider ul.slides-studio li img{
    height: 400px !important
  }
  
  /*end*/
  
}
@media screen and (min-width:640px) and (max-width:767px) {
  .container{
    width:100%;
  }
  header nav{
    padding:4px 15px 0px 5px;
  }
  #lang{
    margin-top:4px;
  }
  footer {
    background: #fff;
    width: 95%;
    margin: 0 auto;
  }
  .footer-content-first{
    width:50%;
  }
  .footer-content-first img{
    margin-top:29px;
    width:100%;
  }
  .footer-content-second{
    width:50%;
  }
  .news-detailcontent-01{
    padding-left:3%;
    width:32%;
  }
  .news-detailcontent-02{
    width:65%;
  }
  .content-second-first-blue{
    width:100%;
    height:auto;
  }
  .content-second-first-white{
    width:100%;
    height:auto;
  }
  .box-blue{
    width: 94%;
    margin: 0% 3% 0 3%;
  }
  .box-white{
    width: 94%;
    margin: 0% 3% 0 3%;
  }
  .box-image{
    width:100%;
  }
  .health-news-content-1{
    width: 90%;
    height: auto;
    float: left;
    padding-left: 5%;
    padding-right: 5%;
  }
  .health-news-content-2{
    width:100%;
  }
  .health-news-related-pos-img{
    height:200px;
  }
  .row-content{
    width:100%;
    height: 273px;
  }
  .row-content-01{
    height: 273px;
  }
  .row-content-02{
    height: 273px;
  }
  .row-01{
    height:300px;
  }
  .row-02{
    height:300px;
  }
  .row-03{
    height:273px;
    top:300px;
  } 
  .row-04{
    height:273px;
    top:300px;
  }
  .row-detail01{
    width:100%;
  }
  .row-detail02{
    width:100%;
  }
  .row-detailcontent{
    width:100%;
  }
  .row-detailcontent-01{
    width:100%;
    position:relative;
  }
  .row-detailcontent-02{
    width:100%;
    position:relative;
    z-index: 1000;
  }
  .row-back{
    width:99%;
    margin-bottom:10px;
  }
  .row-back img{
    width:30%;
  }
  #row-back{
    width:100%;
  }
  .social-detail01{
    width:40%;
  }
  .social-detail02{
    width:60%;
  }
  .social-detailcontent-01{
    width:37%;
    padding-left:3%;
  }
  .social-detailcontent-02{
    width:60%;
  }
  #press-overlay span h2{
    font-size:10px;
  }
  #press-overlay span div{
    font-size:10px;
  }
  .detailcontent-first{
    margin-top:-8px;
    width:100%;
  }
  .detailcontent-second{
    width:100%;
    height:450px;
  }
  .image-box{
    width: 100%;
  }
  .text-box{
    width: 100%;
  }
  .text-box p{
    padding:20px 0px 0px 0px !important;
    margin:0px;
  }
  .desc-box {
    width: 95%;
  }
  .box-greetings{
    width: 95%;
  }
  .left-box, .right-box{
    position:absolute;
  }
  .visi-box{
    height:350px !important;
  }
  .visi-misi {
    width: 100%;
    height: auto;
    position: relative;
    top: 0px;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
  }
  .abc{
    width: 90% !important;
    height: auto;
    padding: 0% 5% 0% 5%;
    min-height:300px;
  }
  .misi-box{
    height: 500px !important;
  }
  .text-missiontext img {
    float: left;
    margin-left: -0.5%;
    padding-right: 5%;
    width: 3%;
  }
  .text-missiontext p {
    float: left;
    width: 92%;
    margin-top: 0px;
    margin-bottom: 10px;
    font-size: 12px;
  }
  .culture-box{
    height:500px !important;
  }
  .text-culturetext img{
    float: left;
    margin-left: -0.5%;
    padding-right: 5%;
    width: 3%;
  }
  .text-culturetext p{
    float: left;
    width: 92%;
    margin-top: 0px;
    margin-bottom: 10px;
    font-size: 12px;
  }
  #bottom_button{
    width:65px;
  }
  .greetings-title{
    width:100%;
  }
  .greetings-desc{
    width:100%;
    max-height:300px;
    overflow:auto;
  }
  .productlist-list{
    height:auto;
  }
  .detailcontent-second{
    height:550px;
  }

  #modal-feed{
    width: 95%;
  }

  #modal{
    width: 95%;
  }

  .close{
    padding: 20px 10px;
  }

  .event{
    padding-right: 10px;
  }

  .keluhan{
    padding-right: 10px;
  }

  .box-alamat{
    right: 10px;
  }

  #modal-feed .copy {
    width: 50%;
  }

  #modal .copy{
    width: 50%;
  }

  #modal-feed .content-title {
    width: 37%;
  }

  #modal .content-title{
    width: 37%;
  }

  #jk{
    padding-right: 140px;
  }

  /*mobile*/
  .header-mobile{
    display: block !important;
  }

  .menu{
    display: none !important;
  }

  .health-news-image img{
    margin-top: 0px;
  }

  .skdslider{
    top: 0px !important;
  }

  .detailcontent-first{
    margin-top: 0px !important;
  }
  .adverse{
    font-size:14px;
  }
  .feedback{
    font-size:14px;
  }
  /*end*/

  /*slider*/
  .skdslider{
    height: 500px !important;
  }

  .skdslider ul.slides-studio li{
    height: 500px !important;
  }

  .skdslider ul.slides-studio li img{
    height: 500px !important;
  }
  
  /*end*/
  
}
@media screen and (min-width:768px) and (max-width:960px) {
  .line-letter{
    font-size: 16px;
  }

  .text-culturetext{
    line-height: 15px !important;
  }

  .text-missiontext{
    line-height: 15px !important;
  }

  
  .modal-content .title {
    width: 230px !important;
  }
  
  #row-back-newsinfo{
    width:98%;
  }
  #modal-feed {
    width: 95% !important;
  }

  #modal{
    width: 95% !important;
  }

  .box-alamat{
    font-size: 8px;
    left: 10px;
  }

  .box-alamat span h3{
    font-size: 12px !important;
  }

  .footer-content-first{
    width:50%;
    
  }
  .footer-content-first img {
    margin-top: 21px;
    width: 100%;
  }
  .footer-content-second{
      width:50%;
  }
  .container{
    width:95%;
  }
  .box-blue{
    width: 32%;
    margin-left: 3%;
    height: 286px;
    float: left;
  }
  .box-white{
    width: 32%;
    margin-left: 3%;
    height: 286px;
    float: left;
  }
  .health-news-related .health-news-related-title{
    font-size:10px;
  }
  .health-news-related .health-news-related-title p{
    padding:8px;
  }
  .social-detailcontent-01{
    width:35%;
  }
  .social-detailcontent-02{
    width:65%;
  }
  #press-overlay span h2{
    font-size:10px;
  }
  .detailcontent-first{
    margin-top:-8px;
    width:100%;
  }
  .detailcontent-second{
    width:100%;
    height:450px;
  }
  .row-detail01{
    width:100%;
  }
  .row-detail02{
    width:100%;
  }
  .row-detailcontent{
    width:100%;
  }
  .row-detailcontent-01{
    width:100%;
    position:relative;
  }
  .row-detailcontent-02{
    width:100%;
    position:relative;
    z-index: 1000;
  }
  .row-back{
    width:100%;
  }
  #row-back{
    width:95%;
  }
  .desc-box{
    width:95%;
  }
  .box-greetings {
    width:95%;
  }
  .visi-misi{
    width: 95%;
  }
  .row-content{
    width: 95%;
    height:323px;
  }
  .row-content-01{
    height:323px;
  }
  .row-content-01{
    height:323px;
  }
  .row-01{
    height:350px;
  }
  .row-02{
    height:350px;
  }
  .row-03{
    height:323px;
    top:350px;
  }
  .row-04{
    height:323px;
    top:350px;
  }

  /*slider*/
  .skdslider{
    height: 500px !important;
  }

  .skdslider ul.slides-studio li{
    height: 500px !important;
  }

  .skdslider ul.slides-studio li img{
    height: 500px !important;
  }
  
  /*end*/

  .health-news-related-pos-img{
    height :100px;
  }

  .health-news-related {
    width: 70%;
  }
  .health-news-content {
    width: 100%;
    height: auto;
    margin-top: -10px;
  }

}
@media screen and (min-width:960px) and (max-width:1024px) {
  #row-back-newsinfo{
    width:95%;
  }
  .container{
    width: 90% !important;
  }

  .modal-content .title {
    width: 230px !important;
  }
  .box-alamat{
    font-size: 8px;
    left: 10px;

  }

  .box-alamat span h3{
    font-size: 12px !important;
  }

  .line-letter{
    font-size:20px;
  }
  .about-social{
    width:90%;
  }
  .abc{
    height: 700px;
  }
  .text-culturetext{
    line-height: 15px !important;
  }

  .text-missiontext{
    line-height: 15px !important;
  }

  /*slider*/
  .skdslider{
    height: 600px !important;
  }

  .skdslider ul.slides-studio li{
    height: 600px !important;
  }

  .skdslider ul.slides-studio li img{
    height: 600px !important;
  }
  
  /*end*/
}
@media screen and (min-width:1280px) and (max-width:1599px) {
  .row-content-title {
    padding-top: 25%;
    text-align: center;
  }
}
@media screen and (min-width:1600px) {}
@media screen and (min-width:1920px) {}
@media print {}