.header{}
  .logo-banner{}
  .banner{}
  .hotline{
  font-family: 'UTMGuanine';
  font-size: 16px;
  margin: 0;
  position: absolute;
  right: 15px;
  bottom: 15px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  background-color: #02adcf;
  background-image: -webkit-linear-gradient(top, #02adcf, rgba(2,173,207,.98) 2%, rgba(20,190,224,.97) 3%, rgba(20,190,224,0));
  background-image: -moz-linear-gradient(top, #02adcf, rgba(2,173,207,.98) 2%, rgba(20,190,224,.97) 3%, rgba(20,190,224,0));
  background-image: -o-linear-gradient(top, #02adcf, rgba(2,173,207,.98) 2%, rgba(20,190,224,.97) 3%, rgba(20,190,224,0));
  background-image: -ms-linear-gradient(top, #02adcf, rgba(2,173,207,.98) 2%, rgba(20,190,224,.97) 3%, rgba(20,190,224,0));
  background-image: linear-gradient(to bottom, #02adcf, rgba(2,173,207,.98) 2%, rgba(20,190,224,.97) 3%, rgba(20,190,224,0));
  height: 62px;
  padding: 30px 10px 0 10px;
}.hotline:before{content:"";background: url(images/hotline-icon.png);width: 151px;height: 64px;position: absolute;top: -36px;background-size: cover;left: 20px;}
  .hotline span{
  color: #fff109;
}

.mylogo{position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);}
.fixed .mylogo img{
  max-height: 50px;
}
.about-bg{
  padding: 45px 0 40px;
  background: url(images/bong.png) no-repeat center bottom;
  margin-bottom: 40px;
}
  .about-bg .desc{
  max-width: 80%;
  margin: 0 auto;
  padding: 20px 0 40px;
}
 .about-bg .desc img {
  margin-bottom: 10px;
 }
  .about-bg .xemthem{}
  .about-bg .xemthem a{
  display: inline-block;
  font-size: 14px;
  color: #02adcf;
  font-family: 'RobotoBold';
  line-height: 33px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  background-color: rgba(255,223,11,0);
  border: solid 1px #02adcf;
  padding: 0 14px;
}
  .idx-tit{
  font-family: 'UTMAlpineKT';
  font-size: 48px;
  line-height: 1;
  background: url(images/idx-tit.png) no-repeat center bottom;
  padding-bottom: 25px;
  margin-bottom: 20px;
}
  .idx-tit span,.idx-tit a{
  color: #02adcf;
}
  .spnoibat-bg{}
  .spnoibat-bg .nav-pills>li{float: none;display: inline-block;}
  .spnoibat-bg .nav>li>a{
  background-color: #fff;
  font-size: 14px;
  color: #02adcf;
  font-family: 'RobotoBold';
  border: 1px solid #02adcf;
  padding: 7px 14px;
}
.spnoibat-bg .nav-pills>li.active>a, .spnoibat-bg .nav-pills>li.active>a:focus, .spnoibat-bg .nav-pills>li.active>a:hover{
  color: #fff;
  background-color: #02adcf;
}
.spnoibat-bg .nav{
  margin-bottom: 40px;
}


.dichvu-bg{
  background: url(images/about-bg.png) no-repeat;
  background-size: cover;
  padding: 45px 0 10px;
}
  .dichvu-main{}
  .dichvu-item{
  padding: 10px 0;
  outline: none;
}
  .dichvu-item>a{
  display: block;
  max-width: 268px;
  width: 96%;
  margin: 0 auto;
  outline: none;
}
  .dichvu-item>a figure{
  width: 268px;
  height: 268px;
  border-radius: 50%;
  background-color: #dbdbdb;
  -webkit-box-shadow: 0 0 5px rgba(0,0,0,.57);
  -moz-box-shadow: 0 0 5px rgba(0,0,0,.57);
  box-shadow: 0 0 5px rgba(0,0,0,.57);
  border: solid 8px #fff;
  overflow: hidden;
  position: relative;
}
  .dichvu-item>a figure img{width: 100%;}
  .dichvu-item>a h5{
  position: absolute;
  bottom: 20px;
  background: url(images/dv-tit.png) no-repeat center top;
  font-size: 15px;
  color: #02adcf;
  text-transform: uppercase;
  left: 0;
  width: 100%;
  margin: 0;
  background-size: cover;
  height: 60px;
  overflow: hidden !important;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 20px 35px;
}
  .dichvu-item>a h5 span{}

.video-bg{
  padding: 45px 0 30px;
}
  .video-main{}
  .video-item{
  width: 25%;
  margin-bottom: 20px;
}
  .video-item a{
  display: block;
  width: 94%;
  margin: 0 auto;
  max-width: 280px;
}
  .video-item a h3 {
    font-size: 14px;
    color: #000;
    text-align: center;
    line-height: 22px;
    font-weight: bold;
  }
  .video-item a img{
  width: 100%;
  height: 245px;
}

  .tintuc-thuvien-bg{}
  .tintuc-thuvien-bg .tit{
  font-family: 'UTMAlpineKT';
  font-size: 48px;
  line-height: 1;
  position: relative;
  padding-bottom: 10px;
  margin-bottom: 20px;
}
.tintuc-thuvien-bg .tit:before{content:"";position:absolute;height: 2px;width: 50px;background: #02adcf;bottom: 0;}
.tintuc-thuvien-bg .tit a, .tintuc-thuvien-bg .tit span{  color: #02adcf;}
  .tinnb-main {}
  .tintuc-bg {
  float: left;
  width: calc(100% - 420px);
}
  .sub-news{
  float: right;
  width: 49%;
}
  .first-news{
  float: left;
  width: 49%;
}
  .tinnb-item{}
  .tinnb-item a:not(.xemthemtin){}
  .tinnb-item a img{
  width: 136px;
  height: 90px;
  float: left;
}
  .tinnb-item a .info{
  float: right;
  width: calc(100% - 150px);
}
  .tinnb-item a .info h6{
  font-family: 'RobotoBold';
  font-size: 16px;
  color: #333;
  overflow: hidden !important;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin: 5px 0;
}
  .tinnb-item a .info p{
  font-family: 'RobotoRegular';
  font-size: 15px;
  color: #333;
  height: 62px;
  overflow: hidden;
}
  .xemthemtin{
  display: inline-block;
  font-family: 'RobotoRegular';
  color: #333;
  border: 2px solid #333;
  padding: 4px 10px;
}
.tinnb-item.first-news{}
  .tinnb-item.first-news a:not(.xemthemtin){}
  .tinnb-item.first-news a img{
  width: 100%;
  height: initial;
  float: none;
}
  .tinnb-item.first-news a .info{
  width: 100%;
  float: none;
}
  .tinnb-item.first-news a .info h6{
  margin: 20px 0 10px;
}
  .tinnb-item.first-news a .info p{
  margin-bottom: 30px;
}  
  .thuvien-bg{
  float: right;
  width: 410px;
}
    .thuvien-boxes{
  margin-bottom: 24px;
}
    .thuvien-boxes article{
  width: 33.33%;
  margin-bottom: 3px;
}
    .thuvien-boxes article a{
  display: block;
  margin: 0 auto;
  border: 1px solid #dcdcdc;
  width: 98%;
}
    .thuvien-boxes article img{
  width: 100%;
}
    .fanpageplace{}  
    .ft-bg{position: relative;background-color: #02adcf;}
    body:not(.index) .main-container{padding: 15px 0}
    .hinhanh-item{width: 25%;}
    .card {
    /* Add shadows to create the "card" effect */
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
    margin: 0 auto;
    width: 96%;
    max-width: 270px;
    padding-bottom: 5px;
}

/* On mouse-over, add a deeper shadow */
.card:hover {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}
