html,body,div {font-family: 'Montserrat', sans-serif;}

/*bg bernama start*/
.bg-bernama {
  background-color: #01aef0 !important;
}
/*bg bernama end*/

/*timeline start*/
.ji-timeline { position: relative; margin: 0 auto; }
.ji-timeline::after { content: ''; position: absolute; width: 2px; background-color: gray; top: 0; bottom: 0; margin-left: 7px; }
.ji-container { padding: 0 0 0 30px; position: relative; background-color: inherit; width: 100%; }
.ji-container::after { content: ''; position: absolute; width: 16px; height: 16px; background-color: white; border: 2px solid gray; top: 0; border-radius: 50%; z-index: 1; }
.ji-right { left: 0%; }
.ji-right::after { left: 0px; }
.ji-content { padding: 0; }
/*timeline end*/
/*textontopimage start*/
.news-item{position:relative;padding:0 50px 0 50px;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:-webkit-transform .6s ease-in-out;transition:transform .6s ease-in-out;transition:transform .6s ease-in-out,-webkit-transform .6s ease-in-out}
.news-title{background-image: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(0,0,0,0.5));position:absolute;right:50px;bottom:10px;left:50px;z-index:10;padding:10px 10px 10px 10px;color:#fff;text-align:center}
@media (max-width:1024px){.news-item{padding:0 0 0 0}.news-title{background:#000;position:static;}}
.news-item-2{position:relative;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:-webkit-transform .6s ease-in-out;transition:transform .6s ease-in-out;transition:transform .6s ease-in-out,-webkit-transform .6s ease-in-out}
.news-title-2{background-image: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(0,0,0,0.5));position:absolute;right:0%;bottom:10px;left:0%;z-index:10;padding:10px 10px 10px 10px;color:#fff;text-align:center}
/*textontopimage end*/
/*videosticky start*/
@-webkit-keyframes fade-in-up {
  0% {
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

@keyframes fade-in-up {
  0% {
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
.video-wrap {
  text-align: center;
}

.video iframe {
  max-width: 100% !important;
  max-height: 100% !important;
}
.video.stuck {
  z-index:1000;  
  position: fixed;
  bottom: 10px;
  right:10px;
  max-width: 345px;
  height: 220px;
  -webkit-transform: translateY(100%);
          transform: translateY(100%);  
  -webkit-animation: fade-in-up .25s ease forwards;
          animation: fade-in-up .25s ease forwards;
}
/*videosticky end*/
/*margincustom start*/
.m-10 {
  margin: 10rem !important;
}

.mt-10,
.my-10 {
  margin-top: 10rem !important;
}

.mr-10,
.mx-10 {
  margin-right: 10rem !important;
}

.mb-10,
.my-10 {
  margin-bottom: 10rem !important;
}

.ml-10,
.mx-10 {
  margin-left: 10rem !important;
}

@media (min-width: 576px) { /*sm*/
  .m-sm-10 {
    margin: 10rem !important;
  }
  .mt-sm-10,
  .my-sm-10 {
    margin-top: 10rem !important;
  }
  .mr-sm-10,
  .mx-sm-10 {
    margin-right: 10rem !important;
  }
  .mb-sm-10,
  .my-sm-10 {
    margin-bottom: 10rem !important;
  }
  .ml-sm-10,
  .mx-sm-10 {
    margin-left: 10rem !important;
  }
}
	
@media (min-width: 768px) { /*md*/
  .m-md-10 {
    margin: 10rem !important;
  }
  .mt-md-10,
  .my-md-10 {
    margin-top: 10rem !important;
  }
  .mr-md-10,
  .mx-md-10 {
    margin-right: 10rem !important;
  }
  .mb-md-10,
  .my-md-10 {
    margin-bottom: 10rem !important;
  }
  .ml-md-10,
  .mx-md-10 {
    margin-left: 10rem !important;
  }
}
	
@media (min-width: 992px) {	/*lg*/
  .m-lg-10 {
    margin: 10rem !important;
  }
  .mt-lg-10,
  .my-lg-10 {
    margin-top: 10rem !important;
  }
  .mr-lg-10,
  .mx-lg-10 {
    margin-right: 10rem !important;
  }
  .mb-lg-10,
  .my-lg-10 {
    margin-bottom: 10rem !important;
  }
  .ml-lg-10,
  .mx-lg-10 {
    margin-left: 10rem !important;
  }
}

@media (min-width: 1200px) { /*xl*/

}
/*margincustom end*/
/*paddingcustom start*/
.p-10 {
  padding: 10rem !important;
}

.pt-10,
.py-10 {
  padding-top: 10rem !important;
}

.pr-10,
.px-10 {
  padding-right: 10rem !important;
}

.pb-10,
.py-10 {
  padding-bottom: 10rem !important;
}

.pl-10,
.px-10 {
  padding-left: 10rem !important;
}

@media (min-width: 576px) { /*sm*/

}
	
@media (min-width: 768px) { /*md*/
  .p-md-10 {
    padding: 10rem !important;
  }
  .pt-md-10,
  .py-md-10 {
    padding-top: 10rem !important;
  }
  .pr-md-10,
  .px-md-10 {
    padding-right: 10rem !important;
  }
  .pb-md-10,
  .py-md-10 {
    padding-bottom: 10rem !important;
  }
  .pl-md-10,
  .px-md-10 {
    padding-left: 10rem !important;
  }
}
	
@media (min-width: 992px) {	/*lg*/
  .p-lg-10 {
    padding: 10rem !important;
  }
  .pt-lg-10,
  .py-lg-10 {
    padding-top: 10rem !important;
  }
  .pr-lg-10,
  .px-lg-10 {
    padding-right: 10rem !important;
  }
  .pb-lg-10,
  .py-lg-10 {
    padding-bottom: 10rem !important;
  }
  .pl-lg-10,
  .px-lg-10 {
    padding-left: 10rem !important;
  }
}

@media (min-width: 1200px) { /*xl*/

}
/*paddingcustom end*/
/*shadow start*/
.box {
  transition: box-shadow .2s;
  box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.2);
  /*border-radius:0px;*/
  /*border: 1px solid #ccc;*/
  background: #fff;
  
}
.box:hover {
  box-shadow: 0 0 5px #72a6fc; 
}
.box:active {
  box-shadow: 0 0 5px #72a6fc; 
}
/*shadow end*/
/*sign in button center start*/
.g-signin2, .fb-signin2{
  width: 100%;
}
.g-signin2 > div{
  margin: 0 auto;
}
.fb-signin2{
  margin: 0 auto;
}
/*sign in button center end*/
/*hide/show div start*/
.expando {
  display: block;
}
.expando:target {
  display: none;
}
/*hide/show div end*/
/*pre tag start*/
pre {
 white-space: pre-wrap;       /* css-3 */
 white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
 white-space: -pre-wrap;      /* Opera 4-6 */
 white-space: -o-pre-wrap;    /* Opera 7 */
 word-wrap: break-word;       /* Internet Explorer 5.5+ */
 font-family: 'Montserrat',sans-serif;
}
/*pre tag end*/
/*weather start*/
.report-container {
    border: #E0E0E0 1px solid;
    padding: 20px 20px 20px 20px;
    border-radius: 2px;
    width: 100%;
    margin: 0 auto;
    background-color:lightgray;
}

.weather-icon {
    vertical-align: middle;
    margin-right: 20px;
}

.weather-forecast {
    color: #212121;
    /*background-color:gray;*/
    font-size: 1.2em;
    font-weight: bold;
    margin: 20px 0px;
}

span.min-temperature {
    margin-left: 15px;
    color: #929292;
}
/*weather end*/
/*h1 start*/
@media (max-width: 575px) { /*xs*/
h1, .h1{
font-size:1.375rem;
}
}
@media (min-width: 576px) { /*sm*/
h1, .h1{
font-size:1.375rem;
}
}
@media (min-width: 768px) { /*md*/
h1, .h1{
font-size:2rem;
}
}
@media (min-width: 992px) { /*lg*/
h1, .h1{
font-size:2.5rem;
}
}
@media (min-width: 1200px) { /*xl*/
h1, .h1{
font-size:2.5rem;
}
}
/*h1 end*/
/*h2 start*/
@media (max-width: 575px) { /*xs*/
h2, .h2{
font-size:1.375rem;
}
}
@media (min-width: 576px) { /*sm*/
h2, .h2{
font-size:1.375rem;
}
}
@media (min-width: 768px) { /*md*/
h2, .h2{
font-size:1.75rem;
}
}
@media (min-width: 992px) { /*lg*/
h2, .h2{
font-size:2rem;
}
}
@media (min-width: 1200px) { /*xl*/
h2, .h2{
font-size:2rem;
}
}
/*h2 end*/
/*h3 start*/
@media (max-width: 575px) { /*xs*/
h3, .h3{
font-size:1.25rem;
}
}
@media (min-width: 576px) { /*sm*/
h3, .h3{
font-size:1.25rem;
}
}
@media (min-width: 768px) { /*md*/
h3, .h3{
font-size:1.5rem;
}
}
@media (min-width: 992px) { /*lg*/
h3, .h3{
font-size:1.75rem;
}
}
@media (min-width: 1200px) { /*xl*/
h3, .h3{
font-size:1.75rem;
}
}
/*h3 end*/
/*h4 start*/
@media (max-width: 575px) { /*xs*/
h4, .h4{
font-size:1.125rem;
}
}
@media (min-width: 576px) { /*sm*/
h4, .h4{
font-size:1.125rem;
}
}
@media (min-width: 768px) { /*md*/
h4, .h4{
font-size:1.375rem;
}
}
@media (min-width: 992px) { /*lg*/
h4, .h4{
font-size:1.5rem;
}
}
@media (min-width: 1200px) { /*xl*/
h4, .h4{
font-size:1.5rem;
}
}
/*h4 end*/
/*h5 start*/
@media (max-width: 575px) { /*xs*/
h5, .h5{
font-size:1rem;
}
}
@media (min-width: 576px) { /*sm*/
h5, .h5{
font-size:1rem;
}
}
@media (min-width: 768px) { /*md*/
h5, .h5{
font-size:1.125rem;
}
}
@media (min-width: 992px) { /*lg*/
h5, .h5{
font-size:1.25rem;
}
}
@media (min-width: 1200px) { /*xl*/
h5, .h5{
font-size:1.25rem;
}
}
/*h5 end*/
/*small start*/
@media (max-width: 575px) { /*xs*/
small,.small {
  font-size: 60%;
  font-weight: 300;
}
}
@media (min-width: 576px) { /*sm*/
small,.small {
  font-size: 60%;
  font-weight: 300;
}
}
@media (min-width: 768px) { /*md*/
small,.small {
  font-size: 70%;
  font-weight: 350;
}
}
@media (min-width: 992px) { /*lg*/
small,.small {
  font-size: 80%;
  font-weight: 400;
}
}
@media (min-width: 1200px) { /*xl*/
small,.small {
  font-size: 80%;
  font-weight: 400;
}
}
/*small end*/
/*news category start*/
@media (max-width: 575px) { /*xs*/
.news-cat{
position:absolute;
top:15px;
left:15px;
}
}
@media (min-width: 576px) { /*sm*/
.news-cat{
position:absolute;
top:15px;
left:15px;
}
}
@media (min-width: 768px) { /*md*/
.news-cat{
position:absolute;
top:15px;
left:15px;
}
}
@media (min-width: 992px) { /*lg*/
.news-cat{
position:absolute;
top:20px;
left:30px;
z-index: 1;
}
}
@media (min-width: 1200px) { /*xl*/
.news-cat{
position:absolute;
top:20px;
left:30px;
z-index: 1;
}
}
/*news category end*/
/*carouselcontent start*/
.carousel-2-control-next {
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 1;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 15%;
  color: #fff;
  text-align: center;
  opacity: 0.5;
  transition: opacity 0.15s ease;
}

@media (prefers-reduced-motion: reduce) {
  .carousel-2-control-next {
    transition: none;
  }
}

.carousel-2-control-next:hover,
.carousel-2-control-next:focus {
  color: #fff;
  text-decoration: none;
  outline: 0;
  opacity: 0.9;
}

.carousel-2-indicators li {
  box-sizing: content-box;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
  width: 30px;
  height: 3px;
  margin-right: 3px;
  margin-left: 3px;
  text-indent: -999px;
  cursor: pointer;
  background-color: #fff;
  background-clip: padding-box;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  opacity: .5;
  transition: opacity 0.6s ease;
}

@media (prefers-reduced-motion: reduce) {
  .carousel-2-indicators li {
    transition: none;
  }
}

.carousel-2-indicators .active {
  opacity: 1;
}

@media (max-width: 575px) { /*xs*/
.carousel-2-indicators {
  position: absolute;
  right: 20px;
  top: 10px;
  z-index: 15;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  list-style: none;
}
.carousel-2-control-next { right: 0; }
.carousel-2-caption { position:static;padding:40px 0 5px 0; }
}
@media (min-width: 576px) { /*sm*/
.carousel-2-indicators {
  position: absolute;
  right: 20px;
  top: 10px;
  z-index: 15;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  list-style: none;
}
.carousel-2-control-next { right: 0; }
.carousel-2-caption { position:static;padding:40px 0 5px 0; }
}
@media (min-width: 768px) { /*md*/
.carousel-2-indicators {
  position: absolute;
  right: 20px;
  top: 10px;
  z-index: 15;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  list-style: none;
}
.carousel-2-control-next { right: 0; }
.carousel-2-caption { position:static;padding:40px 0 5px 0; }
}
@media (min-width: 992px) { /*lg*/
.carousel-2-indicators {
  position: absolute;
  right: 320px;
  top: 10px;
  z-index: 15;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  list-style: none;
}
.carousel-2-control-next { right: 25%; }
.carousel-2-caption {
  background-image: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(0,0,0,0.5));
  position: absolute;
  right: 40%;
  bottom:30px;
  left: 15px;
  z-index: 10;
  padding:10px 10px 0 15px;
  color: #fff;
  /*text-align: center;*/
}
}
@media (min-width: 1200px) { /*xl*/
.carousel-2-indicators {
  position: absolute;
  right: 320px;
  top: 10px;
  z-index: 15;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  list-style: none;
}
.carousel-2-control-next { right: 25%; }
.carousel-2-caption {
  background-image: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(0,0,0,0.5));
  position: absolute;
  right: 40%;
  bottom:30px;
  left: 15px;
  z-index: 10;
  padding:10px 10px 0 15px;
  color: #fff;
  /*text-align: center;*/
}
}
/*carouselcontent end*/
/*modal start
.modal {
   position: absolute;
   top: 50px;
   right: 10px;
   bottom: 0;
   left: 0;
   z-index: 10040;
   overflow: auto;
   overflow-y: auto;
}
modal end*/


