/*!
 * Start Bootstrap - Clean Blog v5.0.1 (https://startbootstrap.com/template-overviews/clean-blog)
 * Copyright 2013-2018 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-clean-blog/blob/master/LICENSE)
 */
/*.drop22:before{
  width:300px;height:10px;background:#aaaaaa;
  display:block;content:"";
  position:absolute;top:30px;left:25px;
}*/
.SelectKhuvuc {
	    cursor: pointer;
}
.nuocdaunguon {
    position: absolute;
    top: 33px;
    left: 6%;
    max-width: 300px;
}
.slidesjs-pagination {
	display:none;
}
.bookslide {
    display: inline-block;
    margin-bottom:66px;
}
.bookslide h4 {
	min-height:56px;
}
.copyright {
	background:#36648B;
	padding: 10px;
	color: #FFF;
}
.nenclose {
	z-index:100;
	background:rgba(0,0,0,.2);
	position:absolute;
	top:0;
	left:0;
	width:100;
	height:100;
}
.navbar-brand img {
	    width: 200px;
	    height:auto;
}
.fixed {
    position:fixed;
    top:0;
}
.navbar-light.fixed {
	background:#FFF !important;
	z-index:99999999;
	box-shadow: 0 2px 2px rgba(0,0,0,.1);
	padding-top:0;
	padding-bottom:0;
}
.navbar-light.fixed .navbar-brand img {
	width:120px;height:auto;}
#mainNav {
	width:100%;
}
.bannerhome {
	margin-top:-30px;
	width: 100%;
	height:auto;
}
 .nhamohinh {
 position:absolute;
 width: 100%;
 }
 .drop22 {
	 z-index:999;
 }
 .lop1 {
	 overflow: hidden;
 }
 /*.navbar {
    position: fixed !important;
    z-index: 9999 !important;
}*/
 .buctranh {
  animation: buctranh 30s ease infinite;
}
@-webkit-keyframes buctranh {
  0%{
     opacity:0;
     filter: grayscale(100%);
  }
  40%{
     opacity:1;
     filter: grayscale(100%);
  }
  50%{
     opacity:1;
     filter: grayscale(10%);
  }
  100%{
     opacity:1;
     filter: grayscale(0%);
  }
}


.drop22:after{
  display:block;
  content:"";
  z-index:999;
  background:#2e8ece;
  width:20px;height:20px;
  position:absolute;left:20px;
  animation: drop22 1000s ease infinite;
  border-radius: 50%;
   
    transform:scale(0.7,1) rotate(45deg);
  
    box-shadow: 1px 1px 7px #1a1a1a;
}
@-webkit-keyframes drop22 {
  0%{
     transform:scale(0.1,0.1) rotate(45deg);
    top:0px;
    border-top-left-radius: 50%;
  }
  0.63%{
     transform:scale(0.1,0.1) rotate(45deg);
    top:0px;
    border-top-left-radius: 50%;
  }
0.68%{
  top:38px;
  border-top-left-radius: 0;
}
  0.73%{
	  top:45px;
    border-top-left-radius: 0;
  transform:scale(0.7,1) rotate(45deg);
  }
  0.78%{
    top:58px;
    opacity:1;
  border-top-left-radius: 50%;
 transform:scale(1,0.2) rotate(0deg);
  
  }
  1.11%{
	 opacity:0;
    top:58px;
  border-top-left-radius: 50%;
 transform:scale(2,0.3) rotate(0deg);
  
  }
100%{
    opacity:0;
  }
}
.drop222 {
	 z-index:999;
 }
.drop222:after{
  display:block;
  content:"";
  z-index:999;
  background:#2e8ece;
  width:10px;height:10px;
  position:absolute;left:5px;
  animation: drop222 1000s ease infinite;
  border-radius: 50%;
   
    transform:scale(0.7,1) rotate(45deg);
  
    box-shadow: 1px 1px 7px #1a1a1a;
}
@-webkit-keyframes drop222 {
  0%{
     transform:scale(0.1,0.1) rotate(45deg);
    top:0px;
    border-top-left-radius: 50%;
  }
  0.63%{
     transform:scale(0.1,0.1) rotate(45deg);
    top:0px;
    border-top-left-radius: 50%;
  }
0.68%{
  top:5px;
  border-top-left-radius: 0;
}
  0.73%{
	  top:13px;
    border-top-left-radius: 0;
  transform:scale(0.7,1) rotate(45deg);
  }
  0.78%{
    top:16px;
    opacity:1;
  border-top-left-radius: 50%;
 transform:scale(1,0.1) rotate(0deg);
  
  }
  1.11%{
	 opacity:0;
    top:16px;
  border-top-left-radius: 50%;
 transform:scale(2,0.2) rotate(0deg);
  
  }
100%{
    opacity:0;
  }
}
.nenkhungbep {
	z-index: 1999;
	position: fixed;
	top: 0;
    left: 0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,.5);
	display:none;
}
.khungbep {
	display:none;
	    position: absolute;
    width: 800px;
    height: 300px;
    top: 178px;
    left: 20%;
    z-index: 1999;
    transform: scale(0.1,0.1);
     transition: all 0.6s;
}
.khungbep.animate {
    transform: scale(1);
}
.clickicon1 img,
.clickicon2 img,
.clickicon3 img,
.clickicon4 img,
.clickicon5 img,
.clickicon6 img {
	width:15px;
	height:auto;
}
.spbep1 {
	position: absolute;
    width: 63px;
    height: 66px;
    top: 85px;
    left: 215px;
    z-index: 1999;
    }
    .clickicon1 {
	position: absolute;
    top: 148px;
    left: 235px;
    z-index: 2999;
    }
    .spbep2 {
	position: absolute;
    width: 68px;
    height: 66px;
    top: 85px;
    left: 280px;
    z-index: 1999;
    }
    .clickicon2 {
	position: absolute;
    top: 148px;
    left: 310px;
    z-index: 2999;
    }
    .spbep3 {
	position: absolute;
    width: 63px;
    height: 66px;
    top: 85px;
    left: 500px;
    z-index: 1999;
    }
    .clickicon3 {
	position: absolute;
    top: 148px;
    left: 515px;
    z-index: 2999;
    }
    .spbep4 {
	position: absolute;
    width: 63px;
    height: 66px;
    top: 85px;
    left: 570px;
    z-index: 1999;
    }
    .clickicon4 {
	position: absolute;
    top: 148px;
    left: 595px;
    z-index: 2999;
    }
    .spbep5 {
	position: absolute;
    width: 63px;
    height: 66px;
    top: 85px;
    left: 640px;
    z-index: 1999;
    }
    .clickicon5 {
	position: absolute;
    top: 148px;
    left: 675px;
    z-index: 2999;
    }
    .spbep6 {
	position: absolute;
    width: 63px;
    height: 66px;
    top: 85px;
    left: 710px;
    z-index: 1999;
    }
    .clickicon6 {
	position: absolute;
    top: 148px;
    left: 740px;
    z-index: 2999;
    }
.layer21 {
	    position: absolute;
    width: 20px;
    height: 80px;
    top: 378px;
    left: 536px;
    z-index: 999;
    cursor: pointer;
}
.layer22 {
	    position: absolute;
    width: 20px;
    height: 70px;
    top: 528px;
    left: 416px;
    z-index: 999;
    cursor: pointer;
}
.layer23 {
	position: absolute;
    width: 232px;
    height: 125px;
    top: 450px;
    left: 496px;
    z-index: 999;
    cursor: pointer;
}
.layer24 {
	position: absolute;
    width: 14px;
    height: 58px;
    top: 388px;
    left: 746px;
    z-index: 999;
    cursor: pointer;
}
.layer25 {
	position: absolute;
    width: 14px;
    height: 58px;
    top: 488px;
    left: 946px;
    z-index: 999;
    cursor: pointer;
}

.khunghome {
	position: relative;
	height: 680px;
	overflow: hidden;
}
.container22 {
  display: block;
  position: absolute;
  overflow: hidden;
  width: 100%;
  height: 680px;
  background-color: #40c6f3;
  animation: container22 1000s ease infinite;
}
@-webkit-keyframes container22 {
  0%{
	  opacity:1;
	  height: 680px;
	  
  }
  0.61%{opacity:1;
	  height: 680px;
  }
  0.62%{opacity:.9;
	  height: 680px;

  }
0.7%{
	opacity:0;
	height: 680px;
	display: none;
}
  0.705%{
	  opacity:0;
	  height:0;
	  display: none;
  
  }
  100%{
	  opacity:0;
	  height:0;
    display: none;
  }
  }
.drop {
  position: absolute;
  width: 0px;
  height: 0px;
  margin: auto;
  top:0px; bottom:0; right:0; left:0;
  background-color: #fff;
  border-radius: 50% 1px 50% 50%;
  -webkit-transform: rotate(-45deg);  
  -webkit-animation: drip 0.4s linear;
}
 .drop:nth-child(2) {  
  border-radius: 50%;
  -webkit-transform: rotate(0deg);
  -webkit-animation: bounce 0.55s 0.8s linear;
} 
.drop:nth-child(4) {  
  border-radius: 50%;
  -webkit-transform: rotate(45deg);
  -webkit-animation: splash-right 0.55s 1.2s linear;
}
.drop:nth-child(5) {  
  border-radius: 50%;
  -webkit-transform: rotate(45deg);
  -webkit-animation: splash-left 0.55s 1.2s linear;
}

.sink {
  position: absolute;
  opacity: 1; 
  width: 0px;
  height: 0px;
  margin: auto;
  top:0; bottom:0; right:0; left:0;
  background-color: #fff;
  border-radius: 50%;
  -webkit-animation: sink 0.6s 0.35s ease-out;
}  
.sink:nth-child(5) {    
  -webkit-animation: sink 0.5s 1.3s ease-out;
}
      
.ripple { 
  position: absolute;
  opacity: 0;
  width: 0px;
  height: 0px;
  margin: auto;
  top:0; bottom:0; right:0; left:0;
  border: #fff solid 1px;
  border-radius: 50%;
  -webkit-animation: ripple 0.55s 0.4s linear;
}
.ripple:nth-child(2) {
  -webkit-animation: ripple 0.55s 0.6s linear;
}
.ripple:nth-child(3) {
  -webkit-animation: ripple 0.55s 1.2s linear;
}  
.ripple:nth-child(7) {
  -webkit-animation: ripple 0.55s 1.4s linear;
}  


@-webkit-keyframes drip {
 0% {
    width: 0px;
    height: 0px;
    top: -300px;
  }
  50% {
    width: 20px;
    height: 20px;
    top: -100px;
  }
  100% { 
    width: 20px;
    height: 20px; 
    top: 10px;
  }
}
 
@-webkit-keyframes bounce {
 0% {
    width: 0px;
    height: 0px;
    top: 10px;
  }
  40% {
    width: 10px;
    height: 10px;
    top: -100px;
  } 
  100% {
    width: 10px;
    height: 10px; 
    top: 0px;
  }
} 
@-webkit-keyframes splash-right {
 0% {
   opacity: 1;
    width: 0px;
    height: 0px;
    top: 10px;
  }
  60% {
    opacity: 1;
    width: 6px;
    height: 6px;
    top: -80px;
    left: 50px;
  }
  100% {
    opacity: 0;
    width: 6px;
    height: 6px;
    top: -70px;
    left: 80px;
  }
}
@-webkit-keyframes splash-left {
 0% {
   opacity: 1;
    width: 0px;
    height: 0px;
    top: 10px;
  }
  60% {
    opacity: 1;
    width: 6px;
    height: 6px;
    top: -60px;
    left: -50px;
  }
  100% {
    opacity: 0;
    width: 6px;
    height: 6px;
    top: -40px;
    left: -80px;
  }
}

@-webkit-keyframes sink {
  0% {
    opacity: 1;
    width: 0px;
    height: 0px;
  }
  50% {
    opacity: 1;
    width: 40px; 
    height: 10px;
  }
  100% {
    opacity: 0; 
    width: 0px; 
    height: 0px;
  }
}

@-webkit-keyframes ripple {
  0% {
    opacity: 1;
    width: 60px;
    height:10px;
  }
  100% {
    opacity: 0; 
    width: 200px;  
    height: 20px;
  }
}

.new00{
  display:block;
  position:absolute;
  left:10%;
  bottom:0;
  z-index:1;
  animation: new00 300s ease infinite;
}
@-webkit-keyframes new00 {
  0%{
	  opacity:0;
  }
  0.66%{
	  opacity:0;
  }
  0.80%{
	  opacity:.3;
  }
0.90%{
	opacity:1;
}
  1.01%{
	  opacity:1;
  
  }
1.5%{
    opacity:1;
  
  
  }
  100%{
    opacity:1;
  
  
  }
  }
.new11 img{width:580px;
	height:auto;
}
.new11{
  display:block;
  position:absolute;
  left:33%;
  z-index:2;
  animation: drop 300s ease infinite;
}
@-webkit-keyframes drop {
  0%{
	  opacity:0;
     transform:scale(0.1,0.1);
    bottom:15px;
    border-top-left-radius: 50%;
  }
  0.66%{
	  opacity:0;
     transform:scale(0.1,0.1);
    bottom:20px;
    border-top-left-radius: 50%;
  }
  0.80%{
	  opacity:.3;
     transform:scale(0.1,0.1);
    bottom:25px;
    border-top-left-radius: 50%;
  }
0.90%{
	opacity:1;
  bottom:78px;
  border-top-left-radius: 0;
}
  1.01%{
	  opacity:1;
    border-top-left-radius: 0;
  transform:scale(1,1);
  }
1.5%{
    bottom:90px;
    opacity:1;
  border-top-left-radius: 0;
  transform:scale(1,1);
  
  }
  100%{
    bottom:90px;
    opacity:1;
  border-top-left-radius: 0;
  transform:scale(1,1);
  
  }
  }
  
  .new223 img {
	  width:580px;
	  height:auto;}
  .new223 {
	  position:absolute;
	  bottom: 90px;
    left: 33%;
	  z-index: 5;
	  }
  .new22 {
	  position:absolute;
	  bottom: 90px;
    left: 33%;
	  z-index: 5;
	  animation: new22 3000s ease infinite;
  }
  @-webkit-keyframes new22 {
  0%{
     opacity: 0;
  }
0.12%{
  opacity: 0;
}
  0.129%{
    opacity: .5;
  }
0.139%{
    
  opacity: 1;
  
  }
  
}
.new333 img {
	  width:580px;
	  height:auto;}
.new333 {
	  position:absolute;
	  bottom: 90px;
    left: 33%;
	  z-index: 5;
	  }
.new33 {
	  position:absolute;
	  bottom: 90px;
    left: 33%;
	  z-index: 5;
	  animation: new33 3000s ease infinite;
  }
  @-webkit-keyframes new33 {
  0%{
     opacity: 0;
  }
0.12%{
  opacity: 0;
}
  0.129%{
    opacity: .5;
  }
0.139%{
    
  opacity: 1;
  
  }
  
}
.new44 img {
	    width:580px;
	    height:auto;
    }
.new44 {
	  position:absolute;
	  bottom: 90px;
    left: 33%;
	  z-index: 5;
	  animation: new44 3000s ease infinite;
  }
  @-webkit-keyframes new44 {
  0%{
     opacity: 0;
  }
0.11%{
  opacity: 0;
}
  0.115%{
    opacity: .5;
  }
0.120%{
    
  opacity: 1;
  
  }
  100%{
    
  opacity: 1;
  
  }
  
}
.new55 img {
	    width:580px;
	    height:auto;
    }
.new55 {
	  position:absolute;
	  bottom: 90px;
    left: 33%;
	  z-index: 5;
	  animation: new55 3000s ease infinite;
  }
  @-webkit-keyframes new55 {
  0%{
     opacity: 0;
  }
0.139%{
  opacity: 0;
}
  0.148%{
    opacity: .5;
  }
0.155%{
    
  opacity: 1;
  
  }
  100%{
    
  opacity: 1;
  
  }
  
}

 .khungnew {
	 position:relative;
	 width:100%;
	 background:#40c6f3;
	 background-size:cover;
	 min-height:800px;
 }
 .ipadpro {
	    display:none;
    }
    .noipadpro {
	    display:block;
    }
 .khunggt {
	     display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
 }
 .uudiemnoibat ul {
	 list-style-type: none;
 }
 .maincontenthomem {
	display:none;
	width: 350px;
	    max-width: 100%;
    position:relative;
    padding-top: 0px;
    margin: 10px auto;
    margin-top:38px;
-webkit-animation: maincontenthomem 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: maincontenthomem 1000s infinite;
}
@-webkit-keyframes maincontenthomem {
  0% {opacity: 0;height:0;}
  0.66% {opacity: 0;height:0;}
  0.75% { opacity: 1;height:450px;}
  8.1% { opacity: 1;height:450px;}
  100% {opacity: 1;height:450px;}
}

@keyframes maincontenthomem {
  0% {opacity: 0;height:0;}
  0.66% {opacity: 0;height:0;}
  0.75% { opacity: 1;height:450px;}
  8.1% { opacity: 1;height:450px;}
  100% {opacity: 1;height:450px;}
}
.fixed-right {
	position:fixed;
	right:0;
	z-index: 9999;
	top:38%;
	background:#3a87c3;
	border-radius:6px;
	color:#FFF;
	padding: 12px 8px;
	text-align:center;
}
.thongtinsp table {
	max-width:720px;
	margin:0 auto;
}
.thongtinsp table td {
	border:1px solid #ccc;
	padding:3px 8px;
}
img {
	max-width:100%;
	height:auto;
}
.fixed-right i {color:#FFF;}
.fixed-right a {
	clear:both;
	display:block;
	margin:4px 0;
}
.fixed-right a span {
	font-size:11px;
}
.khungpopup {
	display:none;
	    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    height: 100%;
    width: 100%;
    background: rgba(0,0,0,.6);
    text-align: center;
    padding: 80px;
}
.khungpopup > div {
	z-index: 1;
}
.khungpopup iframe {
	width:800px;
	height:490px;
	z-index: 999999;
}
.khungpopup .fa-times {
	position:absolute;
	    width: 100%;
    height: 100%;
    padding: 10px;
    text-align: right;
	top:0;
	right:0;
	z-index:-1;
	color:#FFF;
	font-size:25px;
}
.vuottroi {
	max-width:720px;
	margin:0 auto;
}
.titleimg {
	margin:0 0 30px 0;
	background:#3a87c3;
	padding:5px 10px;
	text-align:center;
	color:#FFF;
	font-weight:600;
}
.listsp .item {
	overflow: hidden;
	    display: block;
    position: relative;
} 
.listsp .item a .img2 {
    display: block;
    position: absolute;
    top: 0;
    left: -100%;
}
.listsp .item a .img2 {
    transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -o-transition: all 500ms ease;
}
.listsp .item:hover a .img1 {
    -ms-transform: scale(0, 0);
    -webkit-transform: scale(0, 0);
    transform: scale(0, 0);
}
@media (min-width: 1200px) {
.listsp .item:hover a .img2 {
    left: 0;
}
.listsp.classsp2 .col-lg-12 .item:hover a .img2 {
    left: 25%;
}
}
 /* breadcrumb */
.breadcrumbs-wrap{
	position: relative;
}

.breadcrumbs-wrap .display{
	height: 35px;
	overflow: hidden;
}

.breadcrumbs {
    display: inline-block;
}

.breadcrumbs li {
    float:left;
    margin:0 .5em 0 1em;
}
.tab-content .tab-pane img {
	max-width: 100%;
	height:auto;
}
.maincontenthome {
	width:1190px;
	position: relative;
	    padding-top: 58px;
	margin: 10px auto;
	-webkit-animation: maincontenthome 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: maincontenthome 1000s infinite;
}
@-webkit-keyframes maincontenthome {
  0% {opacity: 0;height:0;}
  0.66% {opacity: 0;height:0;}
  0.75% { opacity: 1;height:690px;}
  8.1% { opacity: 1;height:690px;}
  100% {opacity: 1;height:690px;}
}

@keyframes maincontenthome {
  0% {opacity: 0;height:0;}
  0.66% {opacity: 0;height:0;}
  0.75% { opacity: 1;height:690px;}
  8.1% { opacity: 1;height:690px;}
  100% {opacity: 1;height:690px;}
}
.breadcrumbs a, .show-subs-breadcrumbs {
    background-color:#dcdcdc;
    padding:.6em 1em;
    float:left;
    text-decoration:none;
    color:#333;
    position:relative;
}

.breadcrumbs a:hover, .show-subs-breadcrumbs:hover {
    background-color:#a6c8e6;
}
.subs-breadcrumbs{
    margin: 0;
    padding: 0;
    background-color: #fff linear-gradient(to bottom, rgba(0, 0, 0, 0) 0px, rgba(0, 0, 0, 0.1) 100%);
    background-repeat: repeat;
    background-attachment: scroll;
    background-position: 0 0;
    position: absolute;
    left: 0;
    top: 40px;
    border-width: 1px;
    border-style: solid;
    border-color: rgba(0,0,0,0.1);
    border-top: none;
    box-shadow: 0 0.063em 0.25em rgba(7, 20, 34, 0.25);
    display: none;
    z-index: 999999;
}

.subs-breadcrumbs.open{
	display: block;
}

.subs-breadcrumbs li:last-child,
.subs-breadcrumbs li:last-child a,
.subs-breadcrumbs{
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.subs-breadcrumbs li, .subs-breadcrumbs a {
    display:block;
    float:none;
}

.subs-breadcrumbs a{
    line-height:40px;
    height:40px;
    overflow: hidden;
    padding:0 10px;
}

.subs-breadcrumbs li:not(:last-child) a{
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: rgba(0,0,0,0.1);
}

.subs-breadcrumbs a:hover{
    background-color: rgba(0,0,0,0.1)
}

.subs-breadcrumbs a em{
	display: inline-block;
	margin-right: 5px;
	color: #707070;
}

.show-subs-breadcrumbs{
	padding-right: 5px;
	margin-right: 7px;
	width: 30px;
	text-align: center;
}


body {
    font-size: 14px;
    color: #212529;
    font-family: 'Helvetica',serif
}

p {
    line-height: 1.5;
    margin: 10px 0
}

p a {
    text-decoration: underline
}
/*new 1*/
.bando {
position: relative;

padding-left:16%;
}
.bando1 {    position: absolute;
    top: 0;
    width: 40%;
    margin: 0 40% 0 20%;
    height: 25%;}
.bando2 {    position: absolute;
    top: 25%;
    width: 40%;
    margin: 0 25% 0 30%;
    height: 51%;}
.bando3 {position: absolute;
    top: 76%;
    width: 40%;
    height: 24%;
    margin: 0 30% 0 30%;}
.bando img {
	opacity:.8;
}
.bando img:hover {
	z-index:99;
	opacity:1;
}
.bando .khuvuc {
	opacity:0;
	position: absolute;
	top:30%;
	left:25%;
	text-align:center;
	font-size:22px;
}
.clickkhuvuc {
	display: block;
	clear:both;
	width:100%;
}
.clickkhuvuc .kv {
	float:left;
	width:28%;
	margin:10px 2% 10px 0;
	padding:6px 15px;
	background:#3a87c3;
	color:#FFF;
	font-weight:600;
}
.bando >div:hover .khuvuc {
	opacity:1;
	}
.bandochitiet {
	display:none;
}
/*end new 1*/
/*tooltip*/
#map-container {
	clear: both;	
    position: relative;
    top: 0;
    left: 0;
    height: 520px;
    width: 100%;
    z-index: 990;
    margin-bottom: 60px
}

.tooltip-inner {
    max-width: 250px;
    padding: 10px;
    color: #fff;
    text-align: left !important;
    background-color: #255986;
    border-radius: 4px;
    height: auto;
    overflow: auto
}

.tooltip.top .tooltip-arrow, .tooltip.top-left .tooltip-arrow, .tooltip.top-right .tooltip-arrow {
    border-top-color: #255986;
}

.tooltip.right .tooltip-arrow {
    border-right-color: #255986;
}

.tooltip.left .tooltip-arrow {
    border-left-color: #255986;
}

.tooltip.bottom .tooltip-arrow, .tooltip.bottom-left .tooltip-arrow, .tooltip.bottom-right .tooltip-arrow {
    border-bottom-color: #255986;
}

.tooltip-inner img.pull-left {
    margin: 3px 5px 1px 0;
}

.tooltip-inner img.pull-right {
    margin: 3px 1px 0 5px;
}

.chromeframe {
    position: fixed !important;
    top: 0 !important;
    right: 0;
    left: 0;
    width: 100% !important;
    z-index: 99999999999999 !important;
    background-color: #ffff00 !important;
    color: #000 !important;
    height: 25px;
    line-height: 25px;
    padding: 0.2em 0;
    text-align: center !important;
}

#timeoutsess {
    display: none;
}

#timeoutsess a {
    color: #2f70a7 !important;
}

 /* giotnuoc */
 .mohinh {
	 float:left;
 }
 .mohinhm {
	 float:left;
 }
 .mohinhnha {
	 position:relative;
	 display:inline-block;
	 width: 720px;
    height: 620px;
    left:-33px;
    z-index:105;
    -webkit-animation: xuathien 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: xuathien 1000s infinite;
 }
  .mohinhnham {
	 position:relative;
	 display:block;
    left:0;
    z-index:105;
    -webkit-animation: xuathien 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: xuathien 1000s infinite;
 }
 @-webkit-keyframes xuathien {
  0% {opacity: 0;}
  0.0% {opacity: 0;}
  0.1% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}

@keyframes hienhinh {
  0% {opacity: 0;}
  0.0% {opacity: 0;}
  0.1% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}
 .giotnuoc {
	 position:absolute;
	 top:0px;
	 left:42%;
	 z-index: 99;
	 /*-webkit-animation: giotnuoc 1000s infinite; 
  animation: giotnuoc 1000s infinite;*/
}
.giotnuocm {
	 position:absolute;
	 top:28px;
	 left: 175px;
	 z-index: 99;
	 -webkit-animation: giotnuocm 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: giotnuocm 1000s infinite;
}
@-webkit-keyframes giotnuoc {
  0% {top: -10px;}
  0.6% {top: -10px;}
  0.7% {top: 12px;}
  100% {top: 12px;}
}

@keyframes giotnuoc {
  0% {top: -10px;}
  0.6% {top: -10px;}
  0.7% {top: 12px;}
  100% {top: 12px;}
}

@-webkit-keyframes giotnuocm {
  0% {top: -10px;}
  0.2% {top: 8px;}
  100% {top: 8px;}
}

@keyframes giotnuocm {
  0% {top: -10px;}
  0.2% {top: 8px;}
  100% {top: 8px;}
}
 .binhtong img {
	 width:220px;
	 height:auto;
 }
 .binhtong {
	 position:absolute;
	 top: 475px;
    left: 410px;
	 z-index: 109;
	 
	 -webkit-animation: binhtong 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: binhtong 1000s infinite;
}
.binhtongm img {
	 width:160px;
	 height:auto;
 }
 .binhtongm {
	 position:absolute;
	 top: 263px;
    left: 15px;
	 z-index: 109;
	 
	 -webkit-animation: binhtong 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: binhtong 1000s infinite;
}
@-webkit-keyframes binhtong {
  0% {opacity: 0;}
  0.9% {opacity: 0;}
  0.93% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}

@keyframes binhtong {
  0% {opacity: 0;}
  0.9% {opacity: 0;}
  0.93% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}
.nhanoithat {
	position:absolute;
	top: 1px;
    left: 390px;
	 z-index: 101;
	 -webkit-animation: nhanoithat 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: nhanoithat 1000s infinite;
}
.nhanoithatm {
	position:absolute;
	top: 220px;
    left: 10px;
	 z-index: 101;
	 -webkit-animation: nhanoithat 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: nhanoithat 1000s infinite;
}

@-webkit-keyframes nhanoithat {
  0% {opacity: 0;}
  0.99% {opacity: 0;}
  1.03% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}

@keyframes nhanoithat {
  0% {opacity: 0;}
  0.99% {opacity: 0;}
  1.03% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}
.khungnha {
	position:absolute;
	top: 16px;
    left: 385px;
	 z-index: 102;
	 -webkit-animation: khungnha 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: khungnha 1000s infinite;
}
.khungnha img {width:788px;}
.khungnham {
	position:absolute;
	top: 221px;
    left: 10px;
	 z-index: 102;
	 -webkit-animation: khungnha 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: khungnha 1000s infinite;
}
@-webkit-keyframes khungnha {
  0% {opacity: 0;}
  1.02% {opacity: 0;}
  1.06% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}

@keyframes khungnha {
  0% {opacity: 0;}
  1.02% {opacity: 0;}
  1.06% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}
.binhlocnuoc1 {
	position:absolute;
	top: 382px;
    left: 532px;
	 z-index: 109;
	 -webkit-animation: binhlocnuoc1 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: binhlocnuoc1 1000s infinite;
}
.binhlocnuoc1 img {
    width: 20px;
}

.binhlocnuoc2 {
	position:absolute;
	    top: 405px;
    left: 745px;
    width: 14px;
    height: 40px;
	 z-index: 109;
	 -webkit-animation: binhlocnuoc1 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: binhlocnuoc1 1000s infinite;
}
.binhlocnuoc3 {
	position:absolute;
	    top: 535px;
    left: 418px;
    width: 14px;
    height: 40px;
	 z-index: 109;
	 -webkit-animation: binhlocnuoc1 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: binhlocnuoc1 1000s infinite;
}
.binhlocnuoc4 {
	position:absolute;
	top: 502px;
    left: 949px;
    width: 14px;
    height: 45px;
	 z-index: 109;
	 -webkit-animation: binhlocnuoc1 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: binhlocnuoc1 1000s infinite;
}
@-webkit-keyframes binhlocnuoc1 {
	0% {opacity: 0;}
  0.99% {opacity: 0;}
  1.03% { opacity: 1;}
  1.1%,
  1.18%,
  1.26%,
  1.34%,
  1.42%,
  1.5%,
  1.58%,
  1.66%,
  1.74%,
  1.82%,
  1.9%,
  1.98%,
  2.06%,
  2.14%,
  2.22%,
  2.3%,
  2.38%,
  2.46%,
  2.54%,
  2.62%,
  3.7%,
  2.78%,
  2.86%,
  2.94%,
  3.02%,
  3.1%,
  3.18%,
  3.26%,
  3.34%,
  3.42%,
  3.5%,
  3.58%,
  3.66%,
  3.72%,
  3.8%,
  3.88%,
  3.96%,
  4.04%,
  4.12%,
  4.2%,
  4.28%,
  4.36%,
  4.44% {
    box-shadow: 0 0 8px rgba(18,136,201,.2);
  }

  1.14%,
  1.22%,
  1.3%,
  1.38%,
  1.46%,
  1.54%,
  1.62%,
  1.7%,
  1.78%,
  1.86%,
  1.94%,
  2.02%,
  2.1%,
  2.18%,
  2.26%,
  2.34%,
  2.42%,
  2.5%,
  2.58%,
  2.66%,
  3.74%,
  2.82%,
  2.9%,
  2.98%,
  3.06%,
  3.14%,
  3.22%,
  3.3%,
  3.38%,
  3.46%,
  3.54%,
  3.62%,
  3.7%,
  3.78%,
  3.86%,
  3.94%,
  3.02%,
  4.1%,
  4.18%,
  4.26%,
  4.34%,
  4.42%,
  4.5% {
    box-shadow: 0 0 18px rgba(18,136,201,.99);
  }
  
}
.binhlocnuoc1m {
	position: absolute;
    top: 382px;
    left: 73px;
    z-index: 109;
    width: 8px;
    height: 28px;
	 -webkit-animation: binhlocnuoc1 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: binhlocnuoc1 1000s infinite;
}
.binhlocnuoc2m {
    position: absolute;
    top: 392px;
    left: 162px;
    z-index: 109;
    width: 5px;
    height: 20px;
	 -webkit-animation: binhlocnuoc1 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: binhlocnuoc1 1000s infinite;
}
.binhlocnuoc3m {
    position: absolute;
    top: 306px;
    left: 22px;
    z-index: 109;
    width: 9px;
    height: 29px;
	 -webkit-animation: binhlocnuoc1 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: binhlocnuoc1 1000s infinite;
}
.binhlocnuoc4m {
    position: absolute;
    top: 432px;
    left: 248px;
    z-index: 109;
    width: 6px;
    height: 20px;
	 -webkit-animation: binhlocnuoc1 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: binhlocnuoc1 1000s infinite;
}
.binhlocnuoc {
	position:absolute;
	    top: 0;
    left: 340px;
	 z-index: 108;
	 -webkit-animation: binhlocnuoc 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: binhlocnuoc 1000s infinite;
}
@-webkit-keyframes binhlocnuoc {
  0% {opacity: 0;}
  0.99% {opacity: 0;}
  1.03% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}

@keyframes binhlocnuoc {
  0% {opacity: 0;}
  0.99% {opacity: 0;}
  1.03% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}


.binhlocnuocm {
	position:absolute;
	     top: 222px;
    left: -7px;
    z-index: 108;
	 -webkit-animation: binhlocnuoc 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: binhlocnuoc 1000s infinite;
}
@-webkit-keyframes binhlocnuoc {
  0% {opacity: 0;}
  0.99% {opacity: 0;}
  1.03% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}

@keyframes binhlocnuoc {
  0% {opacity: 0;}
  0.99% {opacity: 0;}
  1.03% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}
.textnha img {
	width:783px;
	height:auto;
}
.textnha {
	position:absolute;
	 top: 50px;
    left: 398px;
	 z-index: 101;
	 -webkit-animation: textnha 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: textnha 1000s infinite;
}
.textnham {
	    position: absolute;
        top: 240px;
    left: 12px;
    z-index: 101;
	 -webkit-animation: textnha 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: textnha 1000s infinite;
}

@-webkit-keyframes textnha {
  0% {opacity: 0;}
  1.02% {opacity: 0;}
  1.05% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}

@keyframes textnha {
  0% {opacity: 0;}
  1.02% {opacity: 0;}
  1.05% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}
 /* end giotnuoc */
 /*nuoc chay*/
#page-wrap { width: 1000px; height:656px; margin: 80px auto;position:relative; }

body { background: #fff; color: #333; font-family: Helvetica, Arial, sans-serif; }
h1 { font-size: 42px; font-weight: 600; margin: 0 0 30px 0; }

.breadcrumb {
	margin-top:5px;
	background:#f8f8f8;
}
.anhthumb li {
	width:20% !important;
}
.anhthumb li a {
	padding:1px !important;
}
.anhthumb li img {
	max-width:100%;
	height:auto;
}
.infosp p {
	margin-top:3px;
	margin-bottom: 3px;
}
.giasp {
	color:#3a87c3;
	font-weight:700;
	font-size:1.2em;
	margin-bottom:3px;
	margin-top:2px;
}
.muahang {
	margin-top:12px;
}
.tensp span {
	background:#3a87c3;
	padding:5px 12px;
	color:#FFF;
	font-size:22px;
}
.tensp {
	margin-bottom:6px;
}
.datmua {
	
	background:#3a87c3;
	padding:8px 25px;
	color:#FFF;
	font-size:1.4em;
}
.datmua .fas {
	margin-right:10px;
}
h2.tieude {
    font-size: 1.5rem;
    margin-top:60px;
}
.tieude {
	color:#3a87c3;
	text-align:center;
}
.tieude span {
	border-bottom: 2px solid #3a87c3;
	padding:0 10px;
}
.thongtinsp img {
	max-width: 100%;
	height:auto;
}
pre {
	background: black;
	text-align: left;
	padding: 20px;
	margin: 0 auto 30px auto; 
}
.tab-content>.active {
    display: block;
        opacity: 1;
}
.nav-tabs li {
	clear:both;
	    width: 100%;
	    
}
.nav-tabs li {
	margin-bottom:6px;
	text-align: center;
	}
	.nav-tabs li a {background: #FFF;width:100%;padding:16px 12px;display: block;font-weight:600;text-transform: uppercase;    font-size: 15px;}
	
	
	.tabs {border:1px solid #40c6f3;}
	
	.tabs a {
		color:#40c6f3;
		
	}
	#tab11 a {
		color:#40c6f3;
	}
	#tab33 a {
		background:#40c6f3;
		color:#FFF;
	}
	.imgpost img {
		max-width: 100%;
		height:auto;
	}
	.leftposts iframe {
		margin-bottom: 20px;
	}
	.postitem {
		clear:both;
	}
/* change border radius for the tab , apply corners on top*/

		.meter { 
			height: 100%;  /* Can be anything */
			position: relative;
			
			/*background: #555;
			-moz-border-radius: 25px;
			-webkit-border-radius: 25px;
			border-radius: 25px;
			padding: 10px;
			-webkit-box-shadow: inset 0 -1px 1px rgba(255,255,255,0.3);
			-moz-box-shadow   : inset 0 -1px 1px rgba(255,255,255,0.3);
			box-shadow        : inset 0 -1px 1px rgba(255,255,255,0.3);*/
		}
		
		.meter2 { 
			width: 100%;  /* Can be anything */
			position: relative;
		}
		.meter3 { 
			height: 100%;  /* Can be anything */
			position: relative;
		}
		.meter4 { 
			width: 100%;  /* Can be anything */
			position: relative;
		}
		.meter5 { 
			height: 100%;  /* Can be anything */
			position: relative;
		}
		.meter6 { 
			height: 100%;  /* Can be anything */
			position: relative;
		}
		.meter7 { 
			height: 100%;  /* Can be anything */
			position: relative;
		}
		.meter9 { 
			height: 100%;  /* Can be anything */
			position: relative;
		}
		.meter9a { 
			height: 100%;  /* Can be anything */
			position: relative;
		}
		.meter11 { 
			height: 100%;  /* Can be anything */
			position: relative;
		}
		.meter12 { 
			height: 100%;  /* Can be anything */
			position: relative;
		}
		.meter10 { 
			width: 100%;  /* Can be anything */
			position: relative;
		}
		
		.meterm { 
			height: 100%;  /* Can be anything */
			position: relative;
		}
		.meter0m { 
			width: 100%;  /* Can be anything */
			position: relative;
		}
		.meter2m { 
			width: 100%;  /* Can be anything */
			position: relative;
		}
		.meter3m { 
			height: 100%;  /* Can be anything */
			position: relative;
		}
		.meter4m { 
			width: 100%;  /* Can be anything */
			position: relative;
		}
		.meter5m { 
			height: 100%;  /* Can be anything */
			position: relative;
		}
		.meter6m { 
			height: 100%;  /* Can be anything */
			position: relative;
		}
		.meter7m { 
			height: 100%;  /* Can be anything */
			position: relative;
		}
		.meter9m { 
			height: 100%;  /* Can be anything */
			position: relative;
		}
		.meter9am { 
			height: 100%;  /* Can be anything */
			position: relative;
		}
		.meter11m { 
			height: 100%;  /* Can be anything */
			position: relative;
		}
		.meter12m { 
			height: 100%;  /* Can be anything */
			position: relative;
		}
		.meter10m { 
			width: 100%;  /* Can be anything */
			position: relative;
		}
		.meterm > span {
			display: block;
			height: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter0m > span {
			display: block;
			width: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter2m > span {
			display: block;
			width: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter3m > span {
			display: block;
			height: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter4m > span {
			display: block;
			width: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter5m > span {
			display: block;
			height: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter6m > span {
			display: block;
			height: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter7m > span {
			display: block;
			height: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter9m > span {
			display: block;
			height: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter9am > span {
			display: block;
			height: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter10m > span {
			display: block;
			width: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter11m > span {
			display: block;
			height: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter12m > span {
			display: block;
			height: 100%;
			position: relative;
			overflow: hidden;
		}
		
		.meter > span {
			display: block;
			height: 100%;
			   /*-webkit-border-top-right-radius: 8px;
			-webkit-border-bottom-right-radius: 8px;
			       -moz-border-radius-topright: 8px;
			    -moz-border-radius-bottomright: 8px;
			           border-top-right-radius: 8px;
			        border-bottom-right-radius: 8px;
			    -webkit-border-top-left-radius: 20px;
			 -webkit-border-bottom-left-radius: 20px;
			        -moz-border-radius-topleft: 20px;
			     -moz-border-radius-bottomleft: 20px;
			            border-top-left-radius: 20px;
			         border-bottom-left-radius: 20px;*/
			/*background-color: rgb(43,194,83);
			background-image: -webkit-gradient(
			  linear,
			  left bottom,
			  left top,
			  color-stop(0, rgb(43,194,83)),
			  color-stop(1, rgb(84,240,84))
			 );
			background-image: -moz-linear-gradient(
			  center bottom,
			  rgb(43,194,83) 37%,
			  rgb(84,240,84) 69%
			 );*/
			/*-webkit-box-shadow: 
			  inset 0 2px 9px  rgba(255,255,255,0.3),
			  inset 0 -2px 6px rgba(0,0,0,0.4);
			-moz-box-shadow: 
			  inset 0 2px 9px  rgba(255,255,255,0.3),
			  inset 0 -2px 6px rgba(0,0,0,0.4);
			box-shadow: 
			  inset 0 2px 9px  rgba(255,255,255,0.3),
			  inset 0 -2px 6px rgba(0,0,0,0.4);*/
			position: relative;
			overflow: hidden;
		}
		
		.meter2 > span {
			display: block;
			width: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter3 > span {
			display: block;
			height: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter4 > span {
			display: block;
			width: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter5 > span {
			display: block;
			height: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter6 > span {
			display: block;
			height: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter7 > span {
			display: block;
			height: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter9 > span {
			display: block;
			height: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter9a > span {
			display: block;
			height: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter10 > span {
			display: block;
			width: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter11 > span {
			display: block;
			height: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter12 > span {
			display: block;
			height: 100%;
			position: relative;
			overflow: hidden;
		}
		.meter12 > span:after,
		.meter11 > span:after,
		.meter10 > span:after,
		.meter9 > span:after,
		.meter9a > span:after,
		.meter7 > span:after,
		.meter6 > span:after,
		.meter5 > span:after,
		.meter4 > span:after,
		.meter3 > span:after,
		.meter2 > span:after, .animate > span > span ,
		.meter > span:after, .animate > span > span {
			content: "";
			position: absolute;
			top: 0; left: 0; bottom: 0; right: 0;
			background-image: 
			   -webkit-gradient(linear, 0 0, 100% 100%, 
			      color-stop(.25, rgba(255, 255, 255, .2)), 
			      color-stop(.25, transparent), color-stop(.5, transparent), 
			      color-stop(.5, rgba(255, 255, 255, .2)), 
			      color-stop(.75, rgba(255, 255, 255, .2)), 
			      color-stop(.75, transparent), to(transparent)
			   );
			background-image: 
				-moz-linear-gradient(
				  -45deg, 
			      rgba(255, 255, 255, .2) 25%, 
			      transparent 25%, 
			      transparent 50%, 
			      rgba(255, 255, 255, .2) 50%, 
			      rgba(255, 255, 255, .2) 75%, 
			      transparent 75%, 
			      transparent
			   );
			z-index: 1;
			-webkit-background-size: 50px 50px;
			-moz-background-size: 50px 50px;
			-webkit-animation: move 3s linear infinite;
			   -webkit-border-top-right-radius: 8px;
			-webkit-border-bottom-right-radius: 8px;
			       -moz-border-radius-topright: 8px;
			    -moz-border-radius-bottomright: 8px;
			           border-top-right-radius: 8px;
			        border-bottom-right-radius: 8px;
			    -webkit-border-top-left-radius: 20px;
			 -webkit-border-bottom-left-radius: 20px;
			        -moz-border-radius-topleft: 20px;
			     -moz-border-radius-bottomleft: 20px;
			            border-top-left-radius: 20px;
			         border-bottom-left-radius: 20px;
			overflow: hidden;
		}
		.meter12m > span:after,
		.meter11m > span:after,
		.meter10m > span:after,
		.meter9m > span:after,
		.meter9am > span:after,
		.meter7m > span:after,
		.meter6m > span:after,
		.meter5m > span:after,
		.meter4m > span:after,
		.meter3m > span:after,
		.meter2m > span:after,
		.meter0m > span:after,
		.meterm > span:after, .animate > span > span {
			content: "";
			position: absolute;
			top: 0; left: 0; bottom: 0; right: 0;
			background-image: 
			   -webkit-gradient(linear, 0 0, 100% 100%, 
			      color-stop(.25, rgba(255, 255, 255, .2)), 
			      color-stop(.25, transparent), color-stop(.5, transparent), 
			      color-stop(.5, rgba(255, 255, 255, .2)), 
			      color-stop(.75, rgba(255, 255, 255, .2)), 
			      color-stop(.75, transparent), to(transparent)
			   );
			background-image: 
				-moz-linear-gradient(
				  -45deg, 
			      rgba(255, 255, 255, .2) 25%, 
			      transparent 25%, 
			      transparent 50%, 
			      rgba(255, 255, 255, .2) 50%, 
			      rgba(255, 255, 255, .2) 75%, 
			      transparent 75%, 
			      transparent
			   );
			z-index: 1;
			-webkit-background-size: 50px 50px;
			-moz-background-size: 50px 50px;
			-webkit-animation: move 3s linear infinite;
			   -webkit-border-top-right-radius: 8px;
			-webkit-border-bottom-right-radius: 8px;
			       -moz-border-radius-topright: 8px;
			    -moz-border-radius-bottomright: 8px;
			           border-top-right-radius: 8px;
			        border-bottom-right-radius: 8px;
			    -webkit-border-top-left-radius: 20px;
			 -webkit-border-bottom-left-radius: 20px;
			        -moz-border-radius-topleft: 20px;
			     -moz-border-radius-bottomleft: 20px;
			            border-top-left-radius: 20px;
			         border-bottom-left-radius: 20px;
			overflow: hidden;
		}
		
		.animate > span:after {
			display: none;
		}
		
		@-webkit-keyframes move {
		    0% {
		       background-position: 0 0;
		    }
		    100% {
		       background-position: 50px 50px;
		    }
		}
		
		.orange > span {
			background-color: #f1a165;
			background-image: -moz-linear-gradient(top, #f1a165, #f36d0a);
			background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #f1a165),color-stop(1, #f36d0a));
			background-image: -webkit-linear-gradient(#f1a165, #f36d0a); 
		}
		
		.blue > span {
			background-color: #00CCFF;
			/*background-image: -moz-linear-gradient(top, #00CCFF, #00FFFF);
			background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #00CCFF),color-stop(1, #00FFFF));
			background-image: -webkit-linear-gradient(#00CCFF, #00FFFF);*/
		}
		.bluedark > span {
			background-color: #6666FF;
			background-image: -moz-linear-gradient(top, #6666FF, #3366FF);
			background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #6666FF),color-stop(1, #3366FF));
			background-image: -webkit-linear-gradient(#6666FF, #3366FF);
		}
		.red > span {
			background-color: #f0a3a3;
			background-image: -moz-linear-gradient(top, #f0a3a3, #f42323);
			background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #f0a3a3),color-stop(1, #f42323));
			background-image: -webkit-linear-gradient(#f0a3a3, #f42323);
		}
		
		.nostripes > span > span, .nostripes > span:after {
			-webkit-animation: none;
			background-image: none;
		}
	
.layer0,
.layer1,
.layer2,
.layer3,
.layer4,
.layer4a,
.layer4b,
.layer5,
.layer6,
.layer7,
.layer7a,
.layer8,
.layer8a,
.layer9,
.layer9a,
.layer10,
.layer11,
.layer12 {
	position:absolute;
}
.layer0 {
	top: 260px;
    left: 23px;
    width: 5px;
    height: 131px;
	z-index:1;
    
}
.layer1 {
	    top: 508px;
    left: 20px;
    width: 571px;
    height: 5px;
    z-index: -1;
}
.layer2 {
	    top: 376px;
    left: 98px;
    width: 5px;
    height: 135px;
	z-index:3;
	transform: rotate(180deg);
}
.layer3 {
	    top: 376px;
    left: 98px;
    width: 38px;
    height: 5px;
	z-index:4;
}
.layer4 {
	top: 380px;
    left: 326px;
    width: 5px;
    height: 131px;
    transform: rotate(180deg);
	z-index:5;
}
.layer4a {
	    top: 394px;
    left: 410px;
    width: 8px;
    height: 98px;
	z-index:5;
}
.layer4b {
	top: 394px;
    left: 334px;
    width: 10px;
    height: 124px;
	z-index:5;
}
.layer5 {
	    top: 380px;
    left: 326px;
    width: 30px;
    height: 5px;
	z-index:-1;
}

.layer6 {
	    top: 499px;
    left: 234px;
    width: 21px;
    height: 5px;
    transform: rotate(270deg);
	z-index:-1;
}

.layer7 {
	top: 490px;
    left: 242px;
    width: 15px;
    height: 5px;
    
	z-index:-1;
}
.layer7a {
	top: 460px;
    left: 542px;
    width: 12px;
    height: 5px;
	z-index:-1;
	transform: rotate(180deg);
}
.layer8 {
	top: 454px;
    left: 281px;
    width: 18px;
    height: 5px;
	z-index:-1;
}
.layer8a {
	    top: 164px;
    left: 220px;
    width: 160px;
    height: 12px;
    transform: rotate(325deg);
    
	z-index:-1;
}
.layer9 {
	top: 468px;
    left: 558px;
    width: 33px;
    height: 5px;
	z-index:-1;
	transform: rotate(180deg);
}
.layer9a {
	top: 458px;
    left: 540px;
    width: 12px;
    height: 5px;
	z-index:-1;
}
.layer10 {
	    top: 468px;
    left: 590px;
    width: 5px;
    height: 45px;
	z-index:-1;
	transform: rotate(180deg);
}
.layer11 {
	    top: 355px;
    left: 596px;
    width: 33px;
    height: 7px;
	z-index:-1;
	transform: rotate(180deg);
}
.layer12 {
	top: 460px;
    left: 548px;
    width: 12px;
    height: 5px;
	z-index:-1;
}


.layer0m,
.layer1m,
.layer2m,
.layer3m,
.layer4m,
.layer4am,
.layer4bm,
.layer5m,
.layer6m,
.layer7m,
.layer7am,
.layer8m,
.layer8am,
.layer9m,
.layer9am,
.layer10m,
.layer11m,
.layer12m {
	position:absolute;
}
.layer0m {
	z-index:1;
}
.layer1m {
	 top: 390px;
    left: 23px;
    width: 245px;
    height: 3px;
    z-index: -1;
}
.layer2m {
	    top: 329px;
    left: 55px;
    width: 3px;
        height: 63px;
	z-index:3;
	transform: rotate(180deg);
}
.layer3m {
	top: 329px;
    left: 56px;
    width: 20px;
    height: 3px;
	z-index:4;
}
.layer4m {
	    top: 329px;
    left: 154px;
    width: 3px;
    height: 63px;
    transform: rotate(180deg);
	z-index:5;
}
.layer4am {
	    top: 444px;
    left: 110px;
    width: 5px;
    height: 38px;
	z-index:5;
}
.layer4bm {
	    top: 390px;
    left: 89px;
    width: 3px;
    height: 40px;
	z-index:5;
}
.layer5m {
	    top: 329px;
    left: 154px;
    width: 9px;
    height: 3px;
	z-index:-1;
}

.layer6m {
	    top: 385px;
    left: 115px;
    width: 9px;
    height: 3px;
    transform: rotate(270deg);
	z-index:-1;
}

.layer7m {
	top: 381px;
    left: 118px;
    width: 8px;
    height: 3px;
    
	z-index:-1;
}
.layer7am {
	    top: 366px;
    left: 243px;
    width: 9px;
    height: 3px;
	z-index:-1;
}
.layer8m {
	top: 454px;
    left: 91px;
    width: 11px;
    height: 3px;
	z-index:-1;
}
.layer8am {
	    top: 364px;
    left: 120px;
    width: 60px;
    height: 8px;
    transform: rotate(325deg);
	z-index:-1;
}
.layer9m {
	    top: 372px;
    left: 253px;
    width: 13px;
    height: 3px;
	z-index:-1;
}
.layer9am {
	    top: 112px;
    left: 145px;
    width: 9px;
    height: 3px;
	z-index:-1;
}
.layer10m {
	    top: 372px;
    left: 265px;
    width: 3px;
    height: 19px;
	z-index:-1;
	transform: rotate(180deg);
}
.layer11m {
	    top: 155px;
    left: 206px;
    width: 13px;
    height: 5px;
	z-index:-1;
	transform: rotate(180deg);
}
.layer12m {
	top: 160px;
    left: 148px;
    width: 8px;
    height: 3px;
	z-index:-1;
}
.clickicon img {width:50px;height:auto;}
.clickicon {
	display:none;
	position:absolute;
	top: 480px;
    left: 116px;
}
.clickicon.animate {
	-webkit-animation: clickicon 6s infinite; 
	animation: clickicon 6s infinite;
}
.clickicon1.animate,
.clickicon2.animate,
.clickicon3.animate,
.clickicon4.animate,
.clickicon5.animate,
.clickicon6.animate {
	-webkit-animation: clickicon 6s infinite; 
	animation: clickicon 6s infinite;
}
@-webkit-keyframes clickicon {
  0%,
  0.1%,
  0.2%,
  0.3%,
  0.4%,
  0.5%,
  0.6%,
  0.7%,
  0.8%,
  0.9%,
  1%,
  1.1%,
  1.2%,
  1.3%,
  1.4%,
   1.5%,
  1.6%,
  1.7%,
  1.8%,
  1.9%,
  2%,
  2.1%,
  2.2%,
  2.3%,
  2.4%,
  2.5%,
  2.6%,
  2.7%,
  2.8%,
  2.9%,
  3%,
  3.1%,
  3.2%,
  3.3%,
  3.4% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  0%,
  0.15%,
  0.25%,
  0.35%,
  0.45%,
  0.55%,
  0.65%,
  0.75%,
  0.85%,
  0.95%,
  1.05%,
  1.15%,
  1.25%,
  1.35%,
  1.45%,
   1.55%,
  1.65%,
  1.75%,
  1.85%,
  1.95%,
  2.05%,
  2.15%,
  2.25%,
  2.35%,
  2.45%,
  2.55%,
  2.65%,
  2.75%,
  2.85%,
  2.95%,
  3.05%,
  3.15%,
  3.25%,
  3.35%,
  3.45% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
  }
  
}

@keyframes clickicon {
  0%,
  20%,
  40%,
  60%,
  80%,
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
  }
}

.mohinh {
	position:relative;
	overflow: hidden;
	width:430px;
	height:710px;
}
.mohinhm {
    position: relative;
    overflow: hidden;
    width: 350px;
    height: 350px;
}
.dongsuoi {
	z-index:99;
}
.dongsuoi img {width:417px;height:auto;}
.dongsuoi .layer111 {
	top:0px;
}
.dongsuoi1 {
	position:absolute;
	top:10px;
	left:0;
	-webkit-animation: hienhinh 1000s infinite; /* Safari 4.0 - 8.0 */
	animation: hienhinh 1000s infinite;
}
.dongsuoim {
	z-index:99;
}
.dongsuoim .layer111m {
	top:0px;
}
.dongsuoi1m img {width:240px;}
.doinui1m img {width:240px;}
.dongsuoi1m {
	position:absolute;
	top: 15px;
    left: 22px;
	-webkit-animation: hienhinh 1000s infinite; /* Safari 4.0 - 8.0 */
	animation: hienhinh 1000s infinite;
}
@-webkit-keyframes hienhinh {
  0% {opacity: 0;}
  0.58% {opacity: 0;}
  0.6% { opacity: 1;}
  6.1% { opacity: 1;}
  100% {opacity: 1;}
}

@keyframes hienhinh {
  0% {opacity: 0;}
  0.58% {opacity: 0;}
  0.6% { opacity: 1;}
  6.1% { opacity: 1;}
  100% {opacity: 1;}
}
.text01 img {
	width:444px;
	height:auto;
}
.text01 {
	position:absolute;
	top:0;
	left:0;
	z-index: 999;
	-webkit-animation: text01 1000s infinite; /* Safari 4.0 - 8.0 */
	animation: text01 1000s infinite;
}
.text01m {
	position:absolute;
	top: 0px;
    left: 70px;
	-webkit-animation: text01 1000s infinite; /* Safari 4.0 - 8.0 */
	animation: text01 1000s infinite;
}
/*.text01m img {
	width:240px;
}*/
@-webkit-keyframes text01 {
  0% {opacity: 0;}
  0.88% {opacity: 0;}
  0.90% { opacity: 1;}
  7.1% { opacity: 1;}
  100% {opacity: 1;}
}

@keyframes text01 {
  0% {opacity: 0;}
  0.88% {opacity: 0;}
  0.90% { opacity: 1;}
  7.1% { opacity: 1;}
  100% {opacity: 1;}
}
.doinui {
	z-index: 100;
}
.doinui1 {
	position: absolute;
	top:10px;
	left:0;
}
.dongsuoi2 {
	position:absolute;
	top:0;
	left:0;
  width: 500px;
  height: 800px;
  background-image: linear-gradient(rgba(255,255,255,.0), rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1));
  -webkit-animation: mymove 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: mymove 1000s infinite;
}
.doinuim {
	z-index: 100;
}
.doinui1m {
	position: absolute;
	    top: -8px;
    left: 98px;
}
.dongsuoi2m {
	position:absolute;
	top:0;
	left:0;
  width: 350px;
  height: 350px;
  background-image: linear-gradient(rgba(255,255,255,.0), rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1),rgba(255,255,255,1));
  -webkit-animation: mymove2 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: mymove2 1000s infinite;
}
@-webkit-keyframes mymove {
  0% {top: -50px;}
  0.82% {top: -50px;}
  1.08% {top: 800px;}
  100% {top: 800px;}
}

@keyframes mymove {
  0% {top: -50px;}
  0.82% {top: -50px;}
  1.08% {top: 800px;}
  100% {top: 800px;}
}


@-webkit-keyframes mymove2 {
  0% {top: -10px;}
  0.80% {top: -10px;}
  1.02% {top: 350px;}
  100% {top: 350px;}
}

@keyframes mymove2 {
  0% {top: -10px;}
  0.80% {top: -10px;}
  1.02% {top: 350px;}
  100% {top: 350px;}
}

/* end nuoc chay */
.napche {
	-webkit-animation: napche 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: napche 1000s infinite;
}
@-webkit-keyframes napche {
  0% {opacity: 1;}
  0.3% {opacity: 1;}
  0.4% { opacity: 0;}
  1.1% { opacity: 0;}
  100% {opacity: 0;}
}

@keyframes napche {
  0% {opacity: 1;}
  0.3% {opacity: 1;}
  0.4% { opacity: 0;}
  1.1% { opacity: 0;}
  100% {opacity: 0;}
}
.anhnen {
	position:absolute;
	top: 0;
    left: 0;
    z-index:100;
}
.napche1 {
	position:absolute;
	top: 0;
    left: 0;
	 z-index: 101;
	 /*-webkit-animation: napche1 1000s infinite; 
  animation: napche1 1000s infinite;*/

}
@-webkit-keyframes napche1 {
  0% {left: 0;}
  0.2% {left: 0;}
  0.3% { left: 158px;}
  0.3% {opacity: 1;}
  0.4% {opacity: 0;}
  99% {opacity: 0;}
  100% {left: 158px;}
}

@keyframes napche1 {
  0% {left: 0;}
  0.2% {left: 0;}
  0.3% { left: 158px;}
  0.3% {opacity: 1;}
  0.4% {opacity: 0;}
  99% {opacity: 0;}
  100% {left: 158px;}
}

.card {
  display: inline-block;
  margin: 10px;
  background: #fff;
  padding: 15px;
  min-width: 200px;
  box-shadow: 0 3px 5px #ddd;
  color: #555;
}
.card .box {
  width: 100px;
  height: 100px;
  margin: auto;
  background: #ddd;
}
.card .box .fill {
  width: 100px;
  height: 100px;
  position: relative;
  background: #03A9F4;
  transition: 0.3s;
}
.scaleX:hover .fill {
  -webkit-transform: scaleX(2);
  transform: scaleX(2);
}
.to-100-0-0 {
  -webkit-transform-origin: 100% 0 0;
          transform-origin: 100% 0 0;
}
.cham11 {
	position:absolute;
	height:6px;
	width:6px;
	border-radius:50%;
	background:#3a87c3;
	top:133px;
	left:190px;
	    z-index: 106;
	    
}
@-webkit-keyframes cham11 {
  0% {opacity: 0;}
  0.3% {opacity: 0;}
  0.34% {opacity: 1;}
  99% {opacity:1;}
  100% {opacity: 1;}
}

@keyframes cham11 {
  0% {opacity: 0;}
  0.3% {opacity: 0;}
  0.34% {opacity: 1;}
  99% {opacity:1;}
  100% {opacity: 1;}
}
.khung11 {
	position:absolute;
	height:1px;
	width:0;
	background:#3a87c3;
	top:135px;
	    left: 102px;
    z-index: 110;
    -webkit-transform-origin: 100% 0 0;
          transform-origin: 100% 0 0;

	}
	@-webkit-keyframes khung11 {
  0% {-webkit-transform: scaleX(2);
  transform: scaleX(2);}
  0.3% {-webkit-transform: scaleX(2);
  transform: scaleX(2);}
  100% {-webkit-transform: scaleX(2);
  transform: scaleX(2);}
}

@keyframes khung11 {
  0% {-webkit-transform: scaleX(2);
  transform: scaleX(2);}
  0.3% {-webkit-transform: scaleX(2);
  transform: scaleX(2);}

  100% {-webkit-transform: scaleX(2);
  transform: scaleX(2);}
}


.khung22 {
	position:absolute;
	height:1px;
	width:0px;
	background:#3a87c3;
	top:210px;
	left:96px;
	z-index: 110;
	-webkit-transform-origin: 100% 0 0;
          transform-origin: 100% 0 0;

}
.cham22 {
	position:absolute;
	height:6px;
	width:6px;
	border-radius:50%;
	background:#3a87c3;
	top:208px;
	left:172px;
	    z-index: 106;
	    
}
@-webkit-keyframes cham22 {
  0% {opacity: 0;}
  0.3% {opacity: 0;}
  0.34% {opacity: 1;}
  99% {opacity:1;}
  100% {opacity: 1;}
}

@keyframes cham22 {
  0% {opacity: 0;}
  0.3% {opacity: 0;}
  0.34% {opacity: 1;}
  99% {opacity:1;}
  100% {opacity: 1;}
}
@-webkit-keyframes khung22 {
  0% {-webkit-transform: scaleX(2);
  transform: scaleX(2);}
  0.3% {-webkit-transform: scaleX(2);
  transform: scaleX(2);}
  100% {-webkit-transform: scaleX(2);
  transform: scaleX(2);}
}

@keyframes khung22 {
  0% {-webkit-transform: scaleX(2);
  transform: scaleX(2);}
  0.3% {-webkit-transform: scaleX(2);
  transform: scaleX(2);}

  100% {-webkit-transform: scaleX(2);
  transform: scaleX(2);}
}



.khung33 {
	position:absolute;
	height:1px;
	width:0px;
	background:#3a87c3;
	top:135px;
	left: 223px;
    z-index: 110;
	
}
.cham33 {
	position:absolute;
	height:6px;
	width:6px;
	border-radius:50%;
	background:#3a87c3;
	top:133px;
	left:220px;
	    z-index: 106;
	   
}
/*@-webkit-keyframes cham33 {
  0% {opacity: 0;}
  0.3% {opacity: 0;}
  0.34% {opacity: 1;}
  99% {opacity:1;}
  100% {opacity: 1;}
}

@keyframes cham33 {
  0% {opacity: 0;}
  0.3% {opacity: 0;}
  0.34% {opacity: 1;}
  99% {opacity:1;}
  100% {opacity: 1;}
}*/
.khung44 {
	position:absolute;
	height:1px;
	width:0px;
	background:#3a87c3;
	top:210px;
	left:208px;
	z-index: 110;
}
.cham44 {
	position:absolute;
	height:6px;
	width:6px;
	border-radius:50%;
	background:#3a87c3;
	top:208px;
	left:208px;
	    z-index: 106;
	    
}
/*@-webkit-keyframes cham44 {
  0% {opacity: 0;}
  0.3% {opacity: 0;}
  0.34% {opacity: 1;}
  99% {opacity:1;}
  100% {opacity: 1;}
}

@keyframes cham44 {
  0% {opacity: 0;}
  0.3% {opacity: 0;}
  0.34% {opacity: 1;}
  99% {opacity:1;}
  100% {opacity: 1;}
}*/


.text11 {
	    position: absolute;
    top: 90px;
    left: 2px;
    color: #3a87c3;
    font-weight: 600;
    width: 120px;
    font-size: 14.5px;

}
@-webkit-keyframes text11 {
  0% {opacity: 0;}
  0.36% {opacity: 0;}
  0.4% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}

@keyframes text11 {
  0% {opacity: 0;}
  0.36% {opacity: 0;}
  0.4% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}
.text22 {
	position:absolute;
	top:186px;
	left:2px;
	color: #3a87c3;
    font-weight: 600;
    font-size: 14.5px;

}
@-webkit-keyframes text22 {
  0% {opacity: 0;}
  0.36% {opacity: 0;}
  0.4% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}

@keyframes text22 {
  0% {opacity: 0;}
  0.36% {opacity: 0;}
  0.4% { opacity: 1;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}
.text33 {
	position:absolute;
	top:110px;
	left:245px;
	width: 120px;
	color: #3a87c3;
    font-weight: 600;
    font-size: 14.5px;

}
@-webkit-keyframes text33 {
  0% {opacity: 0;}
  0.38% {opacity: 0;}
  0.38% {letter-spacing: -10px;}
  0.45% { opacity: 1;}
  0.45% { letter-spacing: 0px;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}

@keyframes text33 {
  0% {opacity: 0;}
  0.38% {opacity: 0;}
  0.38% {letter-spacing: -10px;}
  0.45% { opacity: 1;}
  0.45% { letter-spacing: 0px;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}
.text44 {
	position:absolute;
	top:170px;
	left:245px;
	width: 130px;
	    line-height: 19px;
	    color: #3a87c3;
    font-weight: 600;
    font-size: 14.5px;

}
@-webkit-keyframes text44 {
  0% {opacity: 0;}
  0.38% {opacity: 0;}
  0.38% {letter-spacing: -10px;}
  0.45% { opacity: 1;}
  0.45% { letter-spacing: 0px;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}

@keyframes text44 {
  0% {opacity: 0;}
  0.38% {opacity: 0;}
  0.38% {letter-spacing: -10px;}
  0.45% { opacity: 1;}
  0.45% { letter-spacing: 0px;}
  1.1% { opacity: 1;}
  100% {opacity: 1;}
}

.gioithieunew {
	width:380px;
	position:relative;
	overflow: hidden;
	height:300px;
	    margin: 0 auto;
}
.lop1 {
	z-index:-1;
}

.borderblue {
	border:1px solid #3a87c3;
	padding:10px;
	margin-top:22px;
}






.fullwidthdv {
	margin-top:50px;
	padding:33px 0;
}
#custom1 {
	
	padding:127px 0 218px;
	min-height: 750px;
}
.contentdk {
	border:1px solid #FFF;
	padding:10px;
}
.bandonen {
	position: absolute;
	z-index:2;
	    top: 0px;
}
.maincontent {
    margin-top: 40px;
}

.list1, .list2 {
    padding-left: 6px;
    padding-right: 6px;
}

.item img {
    max-width: 100%;
    height: auto;
}
.titletl span,
.categorysp h2 span {
    color: #3a87c3;
    border-bottom: 1px solid #3a87c3;
}
.titletl span {
font-size: 2rem;
}
.listsp {
	width:100%;
}
.listsp > div {
    padding-left: 4px;
    padding-right: 4px;
    z-index: 10;
}
.listsp .item img {
	max-height:199px;
	margin: 30px auto;
}
.listsp > div:first-child {
    padding-left: 0 !important;
    padding-right: 8px;
}

.listsp > div:last-child {
    padding-left: 8px;
    padding-right: 0;
}

.item {
    text-align: center;
    z-index: 10;
    background: #FFF;
    border: 1px solid #3a87c3;
}

.item h4 {
        color: #FFF;
    padding-top: 3px;
    line-height: 1.5;
    font-weight: 600;
    font-size: 15px;
    margin-bottom: .1rem;
}

.listsp .infosp {
	background:#3a87c3;
    padding: 5px;
}

.categorysp h3 {
    width: 100%;
    color: #FFF;
    background: #3a87c3;
    padding: 3px 15px;
    font-size: 17px;
    line-height: 26px;
}

.listsp p {
    color: #FFF;
    font-weight:600;
    margin: 0;
}

.imgcat {
    width: 285px;
        max-width: 100%;
    position: relative;
    margin: 50px auto;
    background-image: url(../img/cat1.png);
    height: 436px;
    background-position:top center;
    /* background-origin: padding-box; */
    /* background-attachment: fixed; */
    background-size: 70%;
    background-repeat: no-repeat;
}

.imgcat img {
    width: 100%;
    height: auto;
}

.infocat {
    position: absolute;
    width: 70%;
    left: 15%;
    top: 31%;
    color: #FFF;
    text-align: center;
}

.imgcat hr {
    border-top: 2px solid #3a87c3;
    position: absolute;
    top: 38%;
    left: 81%;
    z-index: 9;
    width: 30%;
}

.imgtailieu {
    width: 80%;
    position: relative;
    margin: 50px auto 0;
}

.imgtailieu img {
    width: 100%;
    height: auto;
}

.infotailieu {
    position: absolute;
    width: 100%;
    padding: 8%;
    top: 45%;
    color: #FFF;
    left: 0;
    text-align: center;
    font-weight: 700;
}

.itemtailieu {
    width: 20%;
    float: left;
    margin-bottom: 100px;
}

.bluebg {
    background: #3a87c3;
    margin-bottom: 25px;
}

.fullwidth {
    padding-top: 12px;
    padding-bottom: 12px;
}

.bluebg hr {
    width: 200px;
    border-top: 1px dashed #FFF;
}

.bluecolor {
    color: #3a87c3;
}
.cleardiv {
	clear:both;
	display:block;
}
.main2 img {
	max-width:100%;
	height:auto;
}
.row1 {
    max-width: 700px;
    margin: 0 auto;
}
.row1 .col-lg-12 {
	padding-left:10%;
	padding-right:10%;
}
.nav-tabs {
    border-bottom: none;
}
.h2catsp {
	margin-bottom:45px;
}
.main2 {
    background: #40c6f3;
    padding: 50px 0;
}

.main2 img {
    margin-bottom: 20px;
}
body > img {
	max-width: 100%;
    height: auto;
}
.khungxanh {
	background: #3a87c3;
	color:#FFF;
	text-align: center;
	max-width: 300px;
	margin: 33px auto;
	padding:12px 20px;
	border-radius: 6px;
	font-weight:600;
}
.khungxanh1 {
	background: #3a87c3;
	color:#FFF;
	max-width: 500px;
	margin: 10px 0;
	padding:18px 25px;
	border-radius: 6px;
	font-weight:600;
	font-size:1.5em;
	text-align:center;
}
.khungxanh2 {
	background: #3a87c3;
	color:#FFF;
	max-width: 300px;
	margin: 10px 0;
	width:auto;
	padding:12px 20px;
	border-radius: 6px;
	font-weight:600;
}
.khungxanh3 {
	background: #3a87c3;
	color:#FFF;
	text-align: center;
	width:45%;
	margin: 12px auto 28px;
	padding:28px 20px 12px;
}
.khungxanh4 {
	background: #3a87c3;
	color:#FFF;
	text-align: center;
	width:49%;
	margin: 12px auto 28px;
	padding:28px 20px 12px;
}
.top30 {
	margin-top:30px;
}
.bottom30 {
	margin-bottom:30px;
}
footer {
    clear: both;
    color:#FFF;
}
footer .panel-heading {
	font-weight: 700;
}
footer p {
	margin-bottom:6px;
	margin-top: 6px;
}
footer a {
	color:#FFF;
	font-weight:700;
	}
footer ul {
		    list-style-type: none;
		    }
footer h3 {
	color:#FFF;
	font-size:20px;
	margin-bottom:15px;
}
@media (max-width: 978px) {
    .imgcat hr {
        display:none;
    }

    .listsp > div {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-bottom: 20px;
    }
}

.navbar-nav li a {
    position: relative;
}

.navbar-nav li>a::before {
    content: "\f111";
    color: #3a87c3;
        font-size: 8px;
    position: absolute;
    left: -11px;
    top: 5px;
    width: 10px;
    height: 10px;
    font-family: "Font Awesome 5 Free";
}

@media (min-width: 978px) and (max-width: 1200px) {
    .categorysp h3 {
        font-size: 14px;
    }

    .item h4 {
        font-size: 14px;
    }

    .infocat {
        font-size: 17px;
        width: 50%;
    margin: 0 auto;
    top: 23%;
    left: 10%;
    }
    .list1 {
	    width:75%;
    }
    .list2 {
	    width:25%;
    }
    .maincontenthome {
    width: 978px;
    }
    .mohinh {
    width: 380px;
    }
    .binhtong {
    top: 436px;
    left: 365px;
    }
    .nhanoithat {
    top: 93px;
    left: 365px;
}
    .khungnha {
    top: 88px;
    left: 355px;
    }
    .mohinhnha {
    width: 598px;
    height: 500px;
    left: -33px;
    }
    .binhlocnuoc {
    top: 90px;
    left: 328px;
    }
    .binhlocnuoc1 {
    top: 379px;
    left: 474px;
    }
    .binhlocnuoc2 {
    top: 398px;
    left: 636px;
    width: 12px;
    height: 38px;
    }
    .binhlocnuoc3 {
    top: 495px;
    left: 373px;
    width: 14px;
    height: 40px;
    }
    .binhlocnuoc4 {
    position: absolute;
    top: 474px;
    left: 793px;
    width: 10px;
    height: 30px;
    z-index: 109;
    }
    .binhlocnuoc1 img {
    width: 16px;
}
    .clickicon {
        top: 430px;
    left: 106px;
	}
	.layer1 {
    top: 465px;
    left: 25px;
    width: 461px;
    }
    .layer2 {
    top: 346px;
    left: 95px;
    width: 5px;
    height: 124px;
    }
    .layer3 {
    top: 346px;
    left: 98px;
    width: 32px;
    }
    .layer4 {
    top: 354px;
    left: 275px;
    width: 5px;
    height: 116px;
    }
    .layer5 {
    top: 353px;
    left: 276px;
    width: 15px;
    }
    .layer6 {
    top: 455px;
    left: 200px;
    width: 16px;
    }
    .layer7 {
        top: 449px;
    left: 208px;
    width: 13px;
    }
    .layer9 {
    top: 428px;
    left: 458px;
    width: 26px;
    }
    .layer10 {
    top: 428px;
    left: 480px;
    width: 5px;
    height: 38px;
    }
    .layer7a {
    top: 420px;
    left: 438px;
    width: 12px;
    }
    .khungbep {
    left: 5%;
    }
    .layer21 {
    width: 20px;
    height: 60px;
    top: 378px;
    left: 469px;
    }
    .layer22 {
    width: 20px;
    height: 60px;
    top: 492px;
    left: 368px;}
    .layer24 {
    width: 13px;
    height: 58px;
    top: 388px;
    left: 635px;
    }
    .layer25 {
    width: 13px;
    height: 58px;
    top: 470px;
    left: 792px;
    }
    .layer23 {
    width: 185px;
    height: 105px;
    top: 430px;
    left: 442px;
    }
}


@media (min-width: 767px) and (max-width: 976px) {
	.drop22:after{
  display:block;
  content:"";
  z-index:999;
  background:#2e8ece;
  width:20px;height:20px;
  position:absolute;left:16px;
  animation: drop22 1000s ease infinite;
  border-radius: 50%;
   
    transform:scale(0.7,1) rotate(45deg);
  
    box-shadow: 1px 1px 7px #1a1a1a;
}
@-webkit-keyframes drop22 {
  0%{
     transform:scale(0.1,0.1) rotate(45deg);
    top:0px;
    border-top-left-radius: 50%;
  }
  0.63%{
     transform:scale(0.1,0.1) rotate(45deg);
    top:0px;
    border-top-left-radius: 50%;
  }
0.68%{
  top:20px;
  border-top-left-radius: 0;
}
  0.73%{
	  top:35px;
    border-top-left-radius: 0;
  transform:scale(0.7,1) rotate(45deg);
  }
  0.78%{
    top:38px;
    opacity:1;
  border-top-left-radius: 50%;
 transform:scale(1,0.2) rotate(0deg);
  
  }
  1.11%{
	 opacity:0;
    top:38px;
  border-top-left-radius: 50%;
 transform:scale(2,0.3) rotate(0deg);
  
  }
100%{
    opacity:0;
  }
}
	.new11,
	.new223,
	.new333,
	.new44,
	.new55 {
    left: 15%;
	}
	
    .khungpopup iframe {
	width:700px;
	height:370px;
}
    .maincontenthome {
    width: 767px;
    }
    .mohinh {
    width: 280px;
    }
    .binhtong {
    top: 315px;
    left: 270px;
}
    .nhanoithat {
    top: 54px;
    left: 270px;
}
    .khungnha {
    top: 54px;
    left: 268px;
}
    .mohinhnha {
    width: 487px;
    height: 380px;
    left: -33px;
    }
    .binhlocnuoc {
    top: 55px;
    left: 244px;
}
.binhlocnuoc1 img {
    width: 12.5px;
}
.binhlocnuoc1 {
    top: 288px;
    left: 362px;
    }
    .binhlocnuoc2 {
    position: absolute;
    top: 303px;
    left: 492px;
    width: 10px;
    height: 30px;
    }
    .binhlocnuoc3 {
    position: absolute;
    top: 375px;
    left: 278px;
    width: 15px;
    height: 40px;
    }

.binhlocnuoc4 {
    position: absolute;
    top: 362px;
    left: 618px;
    width: 10px;
    height: 30px;
    }
    
    .textnha {
    position: absolute;
    top: 82px;
    left: 271px;
    }
    .clickicon {
        top: 318px;
    left: 106px;
	}
	.layer1 {
    top: 344px;
    left: 38px;
    width: 367px;
    }
    .layer2 {
    top: 246px;
    left: 93px;
    width: 5px;
    height: 102px;
}
    .layer3 {
    top: 246px;
    left: 98px;
    width: 22px;
    }
    .layer4 {
    top: 254px;
    left: 233px;
    width: 5px;
    height: 94px;
    }
    .layer5 {
    top: 253px;
    left: 236px;
    width: 15px;
    }
    .layer6 {
    top: 336px;
    left: 176px;
    width: 12px;
}
    .layer7 {
    top: 332px;
    left: 181px;
    width: 12px;
}
    .layer9 {
    top: 316px;
    left: 375px;
    width: 26px;
}
    .layer10 {
    top: 316px;
    left: 400px;
    width: 5px;
    height: 31px;
    }
    .layer7a {
    top: 310px;
    left: 364px;
    width: 8px;
    }
    .khungbep {
    left: 5%;
    width: 700px;

    }
    .layer21 {
    width: 20px;
    height: 56px;
    top: 268px;
    left: 360px;
}
    .layer22 {
    width: 20px;
    height: 60px;
    top: 372px;
    left: 273px;
}
    .layer24 {
    width: 13px;
    height: 58px;
    top: 288px;
    left: 490px;
}
    .layer25 {
    width: 15px;
    height: 58px;
    top: 355px;
    left: 614px;
}
    .layer23 {
    width: 138px;
    height: 85px;
    top: 330px;
    left: 342px;
}
}
.nav.panel-tabs {   
	display: flex;
    justify-content: center;
    align-items: center;
        margin-bottom: 20px;
    margin-top: 33px;
    border-bottom: 1px solid #3a87c3;
    }
.nav.panel-tabs li a {
padding: 12px;
margin:0 3px;
background: #f5f5f5;
color: #3a87c3;
    text-transform: uppercase;

display: block;
}
.nav.panel-tabs li a.active {
	font-weight:700;}
.panel.panel-primary {
	    max-width: 720px;
    margin: 0 auto;
}
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
    float: left;
}

#mainNav .navbar-nav>li.nav-item>a:focus, #mainNav .navbar-nav>li.nav-item>a:hover {
    opacity: 1;
}

h1,h2,h3,h4,h5,h6 {
    font-family: 'Helvetica',Arial,sans-serif;
}
.whitebg {
    background: #FFF;
    padding: 10px 15px;
    
    border-radius: 8px;
    width: 390px;
    margin: 25px auto;
    color: #3a87c3;
    font-weight: 700;
}
.gioithieu0 {
	padding-left:3% !important;
}
.gioithieu0 ul {list-style: none;padding-left:15px;}
.gioithieu0 li::before {font-size: 22px;content: "•"; color: #3a87c3;display: inline-block; width: 15px;
  margin-left: -15px;}
.gioithieu1 p,
.gioithieu2 p {
	margin:3px 0;
}
.gioithieu1 h4,
.gioithieu2 h4 {
	margin-bottom:5px;
}
.gioithieu1 h4,
.gioithieu2 h4,
.gioithieu3 h4,
.gioithieu4 h4 {
	color: #3a87c3;
	font-weight:500;
	line-height:30px;
	font-size:19px;
}
.gioithieu1 .icon1,
.gioithieu2 .icon2,
.gioithieu3 .icon3,
.gioithieu4 .icon4 {
	position:relative;
}
.gioithieu3 .icon3,
.gioithieu4 .icon4 {
	padding-right:45px;
	margin-bottom:23px;
	
	margin-top: 75px;
}
.icon2 h4:before,
.icon1 h4:before {
	position:absolute;
	    top: 3px;
    right: 15px;
    width: 26px;
    height: 26px;
    font-size: 18px;
    font-weight: 600;
    line-height: 26px;
    text-align: center;
	border:1px solid #3a87c3;
	border-radius: 50%;
}
.icon3 h4:before,
.icon4 h4:before {
	position:absolute;
	    top: 3px;
    left: 15px;
    width: 26px;
    height: 26px;
    font-size: 18px;
    font-weight: 600;
    line-height: 26px;
    text-align: center;
	border:1px solid #3a87c3;
	border-radius: 50%;
}
.icon1 h4:before {
	content: "1";
	}
	.icon2 h4:before {
	content: "2";
	}
	.icon3 h4:before {
	content: "3";
	}
	.icon4 h4:before {
	content: "4";
	}
.gioithieu1 .icon1,
.gioithieu2 .icon2 {
	padding-right:45px;
	margin-bottom:23px;
	text-align:right;
	position:relative;
}
.gioithieu3 .icon3,
.gioithieu4 .icon4 {
	padding-left:50px;
	margin-bottom:23px;
	text-align: left;
	position:relative;
}
.maincontent > div > div > h1 {
	color: #3a87c3;
	font-size:23px;
	max-width: 400px;
	margin:0 auto;
	font-weight:700;
}
.maincontent > div > div > h2 {
	color: #3a87c3;
	font-size:21px;
	max-width: 500px;
	margin:0 auto;
	font-weight:700;
}
.maincontent {
	margin-bottom:30px;
}
a {
    color: #212529;
    -webkit-transition: all .2s;
    transition: all .2s
}

a:focus,a:hover {
    color: #444
}

blockquote {
    font-style: italic;
    color: #868e96
}

.section-heading {
    font-size: 22px;
    font-weight: 700;
}
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12, .col-xs-13, .col-sm-13, .col-md-13, .col-lg-13, .col-xs-14, .col-sm-14, .col-md-14, .col-lg-14, .col-xs-15, .col-sm-15, .col-md-15, .col-lg-15, .col-xs-16, .col-sm-16, .col-md-16, .col-lg-16, .col-xs-17, .col-sm-17, .col-md-17, .col-lg-17, .col-xs-18, .col-sm-18, .col-md-18, .col-lg-18, .col-xs-19, .col-sm-19, .col-md-19, .col-lg-19, .col-xs-20, .col-sm-20, .col-md-20, .col-lg-20, .col-xs-21, .col-sm-21, .col-md-21, .col-lg-21, .col-xs-22, .col-sm-22, .col-md-22, .col-lg-22, .col-xs-23, .col-sm-23, .col-md-23, .col-lg-23, .col-xs-24, .col-sm-24, .col-md-24, .col-lg-24 {
    position: relative;
    min-height: 1px;
    padding-left: 10px;
    padding-right: 10px;
}
.caption {
    font-size: 14px;
    font-style: italic;
    display: block;
    margin: 0;
    padding: 10px;
    text-align: center;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px
}

::-moz-selection {
    color: #fff;
    background: #0085a1;
    text-shadow: none
}

::selection {
    color: #fff;
    background: #0085a1;
    text-shadow: none
}

img::-moz-selection {
    color: #fff;
    background: 0 0
}

img::selection {
    color: #fff;
    background: 0 0
}

img::-moz-selection {
    color: #fff;
    background: 0 0
}
.khung1 p {
	font-weight:600;
	font-size:17px;
	margin:3px 0;}
.khung1 {
	color:#FFF;
}
.khung1 img {
	clear:both;
}
#mainNav .navbar-brand {
    font-weight: 800;
    color: #3a87c3
}

#mainNav .navbar-toggler {
    font-size: 12px;
    font-weight: 800;
    padding: 13px;
    text-transform: uppercase;
    color: #343a40
}

#mainNav .navbar-nav>li.nav-item>a {
    transition: .6s;
    border-bottom: 2px solid transparent;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase
}


    @media only screen and (min-width: 992px) {
	    #mainNav {
        border-bottom:1px solid transparent;
        background: 0 0
    }

    #mainNav .navbar-brand {
        padding: 3px 20px;
        color: #fff
    }

    #mainNav .navbar-brand:focus,#mainNav .navbar-brand:hover {
        color: rgba(255,255,255,.8)
    }

    #mainNav .navbar-nav>li.nav-item>a {
        padding: 2px 3px;
        margin: 0 12px;
        color: #3a87c3;
    }

    #mainNav .navbar-nav>li.nav-item>a.active {
        opacity: 1;
        color: #555;
    }
        #mainNav {
            -webkit-transition:background-color .2s;
            transition: background-color .2s;
            -webkit-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0);
            -webkit-backface-visibility: hidden
        }

        #mainNav.is-fixed {
            position: fixed;
            top: -67px;
            -webkit-transition: -webkit-transform .2s;
            transition: -webkit-transform .2s;
            transition: transform .2s;
            transition: transform .2s,-webkit-transform .2s;
            border-bottom: 1px solid #fff;
            background-color: rgba(255,255,255,.9)
        }

        #mainNav.is-fixed .navbar-brand {
            color: #212529
        }

        #mainNav.is-fixed .navbar-brand:focus,#mainNav.is-fixed .navbar-brand:hover {
            color: #0085a1
        }

        #mainNav.is-fixed .navbar-nav>li.nav-item>a {
            color: #212529
        }

        #mainNav.is-fixed .navbar-nav>li.nav-item>a:focus,#mainNav.is-fixed .navbar-nav>li.nav-item>a:hover {
            border-bottom: 2px solid #3a87c3;
        }

        #mainNav.is-visible {
            -webkit-transform: translate3d(0,100%,0);
            transform: translate3d(0,100%,0)
        }
        
    }

    header.masthead {
        margin-bottom: 50px;
        background: no-repeat center center;
        position: relative;
    }

    header.masthead .overlay {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
    }

    header.masthead .page-heading,header.masthead .post-heading,header.masthead .site-heading {
        padding: 200px 0 150px;
    }

    @media only screen and (min-width: 768px) {
        header.masthead .page-heading,header.masthead .post-heading,header.masthead .site-heading {
            padding:200px 0
        }
    }

    header.masthead .page-heading,header.masthead .site-heading {
        text-align: center
    }

    header.masthead .page-heading h1,header.masthead .site-heading h1 {
        font-size: 50px;
        margin-top: 0
    }

    header.masthead .page-heading .subheading,header.masthead .site-heading .subheading {
        font-size: 24px;
        font-weight: 300;
        line-height: 1.1;
        display: block;
        margin: 10px 0 0;
        font-family: 'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif
    }

    @media only screen and (min-width: 768px) {
        header.masthead .page-heading h1,header.masthead .site-heading h1 {
            font-size:80px
        }
    }

    header.masthead .post-heading h1 {
        font-size: 35px
    }

    header.masthead .post-heading .meta,header.masthead .post-heading .subheading {
        line-height: 1.1;
        display: block
    }

    header.masthead .post-heading .subheading {
        font-size: 24px;
        font-weight: 600;
        margin: 10px 0 30px;
        font-family: 'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif
    }

    header.masthead .post-heading .meta {
        font-size: 20px;
        font-weight: 300;
        font-style: italic;
        font-family: Lora,'Times New Roman',serif
    }

    header.masthead .post-heading .meta a {
        color: #fff
    }

    @media only screen and (min-width: 768px) {
        header.masthead .post-heading h1 {
            font-size:55px
        }

        header.masthead .post-heading .subheading {
            font-size: 30px
        }
    }

    .post-preview>a {
        color: #212529
    }

    .post-preview>a:focus,.post-preview>a:hover {
        text-decoration: none;
        color: #0085a1
    }

    .post-preview>a>.post-title {
        font-size: 30px;
        margin-top: 30px;
        margin-bottom: 10px
    }

    .post-preview>a>.post-subtitle {
        font-weight: 300;
        margin: 0 0 10px
    }

    .post-preview>.post-meta {
        font-size: 18px;
        font-style: italic;
        margin-top: 0;
        color: #868e96
    }

    .post-preview>.post-meta>a {
        text-decoration: none;
        color: #212529
    }

    .post-preview>.post-meta>a:focus,.post-preview>.post-meta>a:hover {
        text-decoration: underline;
        color: #0085a1
    }

    @media only screen and (min-width: 768px) {
        .post-preview>a>.post-title {
            font-size:36px
        }
    }

    .floating-label-form-group {
        font-size: 14px;
        position: relative;
        margin-bottom: 0;
        padding-bottom: .5em;
        border-bottom: 1px solid #dee2e6
    }

    .floating-label-form-group input,.floating-label-form-group textarea {
        font-size: 1.5em;
        position: relative;
        z-index: 1;
        padding: 0;
        resize: none;
        border: none;
        border-radius: 0;
        background: 0 0;
        -webkit-box-shadow: none!important;
        box-shadow: none!important;
        font-family: Lora,'Times New Roman',serif
    }

    .floating-label-form-group input::-webkit-input-placeholder,.floating-label-form-group textarea::-webkit-input-placeholder {
        color: #868e96;
        font-family: Lora,'Times New Roman',serif
    }

    .floating-label-form-group label {
        font-size: .85em;
        line-height: 1.764705882em;
        position: relative;
        z-index: 0;
        top: 2em;
        display: block;
        margin: 0;
        -webkit-transition: top .3s ease,opacity .3s ease;
        transition: top .3s ease,opacity .3s ease;
        vertical-align: middle;
        vertical-align: baseline;
        opacity: 0
    }

    .floating-label-form-group .help-block {
        margin: 15px 0
    }

    .floating-label-form-group-with-value label {
        top: 0;
        opacity: 1
    }

    .floating-label-form-group-with-focus label {
        color: #0085a1
    }

    form .form-group:first-child .floating-label-form-group {
        border-top: 1px solid #dee2e6
    }

    footer {
        padding: 50px 0 65px;
        background:#1288c9;
    }

    footer .list-inline {
        margin: 0;
        padding: 0
    }

    footer .copyright {
        font-size: 14px;
        margin-bottom: 0;
        text-align: center
    }

    .btn {
        font-size: 14px;
        font-weight: 800;
        padding: 15px 25px;
        letter-spacing: 1px;
        text-transform: uppercase;
        border-radius: 0;
        font-family: 'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif
    }

    .btn-primary {
        background-color: #0085a1;
        border-color: #0085a1
    }

    .btn-primary:active,.btn-primary:focus,.btn-primary:hover {
        color: #fff;
        background-color: #00657b!important;
        border-color: #00657b!important
    }

    .btn-lg {
        font-size: 16px;
        padding: 25px 35px
    }

    /*map */
    .listing-item-container.compact.order-summary-widget .listing-item {
        border-radius: 4px 4px 0 0;
        cursor: default;
        height: 240px
    }

    .listing-item-container.compact.order-summary-widget {
        margin-bottom: 0
    }

    .listing-item-container.compact.order-summary-widget:hover {
        transform: none
    }

    .listing-item-container.list-layout {
        background: 0 0;
        background-color: #f9f9f9;
        margin-bottom: 25px
    }

    .listing-item-container.list-layout:hover {
        transform: translate3d(6px, 0, 0)
    }

    .listing-item-container.list-layout .listing-item {
        display: flex;
        background-color: transparent;
        height: 220px
    }

    .listing-item-container.list-layout .listing-item:before {
        display: none
    }

    .listing-item-container.list-layout .listing-item img {
        border-radius: 0
    }

    .listing-item-container.list-layout .listing-item-content {
        flex: 5;
        position: relative;
        bottom: 0;
        left: 0;
        padding: 0;
        width: 100%;
        z-index: 50;
        box-sizing: border-box
    }

    .listing-item-container.list-layout .listing-item-image {
        min-height: 200px;
        flex: 2;
        height: 100%;
        overflow: hidden;
        border-radius: 4px 0 0 4px;
        position: relative
    }

    .listing-item-container.list-layout .listing-item-image:before {
        content: "";
        width: 100%;
        height: 100%;
        position: absolute;
        z-index: 1;
        display: block;
        background-color: #272729;
        opacity: .2
    }

    .listing-item-container.list-layout span.like-icon {
        bottom: 50%;
        transform: translateY(50%);
        background-color: #eee;
        color: #9d9d9d;
        right: 35px
    }

    .listing-item-container.list-layout span.like-icon.liked, .listing-item-container.list-layout span.like-icon:hover {
        background-color: #f3103c;
        color: #fff
    }

    .listing-item-container.list-layout .listing-item-inner {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        left: 35px;
        padding-right: 120px
    }

    .listing-item-container.list-layout .listing-item-inner h3 {
        color: #333
    }

    .listing-item-container.list-layout .listing-item-inner span {
        color: gray
    }

    .listing-item-container.list-layout .star-rating {
        padding: 8px 0 0
    }

    .listing-item-container.list-layout .numerical-rating {
        margin: 10px 0 5px;
        display: block
    }

    .listing-item-container.list-layout .listing-item-details {
        position: absolute;
        bottom: 25px;
        right: 35px;
        left: auto;
        top: auto;
        padding: 0;
        width: auto;
        z-index: 50;
        color: #888;
        box-sizing: border-box;
        font-weight: 500;
        font-size: 14px
    }

    .listing-item-container {
        background-color: #f6f6f6;
        display: block;
        height: 100%;
        width: 100%;
        border-radius: 4px;
        transform: translate3d(0, 0, 0);
        transition: transform .3s;
        margin-bottom: 30px
    }

    section.fullwidth .listing-item-container, .fs-content .listing-item-container {
        box-shadow: 0 0 8px 0 rgba(0, 0, 0, .08);
        background-color: #fff;
        background: #fff
    }

    section.fullwidth .listing-item-container.list-layout, .fs-content .listing-item-container.list-layout {
        box-shadow: none
    }

    .listing-item-container:hover {
        transform: translate3d(0, -6px, 0)
    }

    listing-item-container.list-layout span.tag, .listing-item-content span.tag {
        text-transform: uppercase;
        font-size: 9px;
        letter-spacing: 2.5px;
        font-weight: 60;
        background: rgba(255, 255, 255, .3);
        border-radius: 50px;
        padding: 4px 16px;
        line-height: 20px;
        color: #fff;
        font-weight: 400;
        margin-bottom: 9px
    }

    .listing-item-container.list-layout span.tag {
        position: absolute;
        bottom: 20px;
        left: 20px;
        background: #66676b;
        margin: 0;
        z-index: 10;
        line-height: 14px;
        padding: 7px 16px;
        margin-right: 20px;
        text-align: center
    }

    .listing-item-details {
        position: absolute;
        top: 24px;
        left: 0;
        padding: 0 32px;
        width: 100%;
        z-index: 50;
        color: #fff;
        box-sizing: border-box;
        font-weight: 500;
        font-size: 15px
    }

    .listing-item-details ul {
        margin: 0;
        list-style: none;
        padding: 0
    }

    .listing-item-details ul li {
        display: inline-block;
        margin-right: 6px;
        line-height: 20px
    }

    .listing-item-details ul li i {
        display: inline-block;
        margin: 0 3px 0 0;
        position: relative;
        top: 0;
        font-size: 14px
    }

    .listing-item-container.compact .listing-item {
        border-radius: 4px
    }

    .listing-item-container.compact .star-rating {
        padding: 5px 0 0
    }

    .listing-item-container.compact .rating-counter {
        color: rgba(255, 255, 255, .7)
    }

    .listing-item-container.compact .star-rating .star.empty:before, .listing-item-container.compact .star-rating .star.half:before {
        color: rgba(255, 255, 255, .3)
    }

    .listing-item-container.compact .listing-item-content span.tag {
        background-color: #66676b
    }

    .fs-inner-container.content.faded-out .listings-container {
        opacity: .2;
        background: #fff;
        pointer-events: none
    }

    .fs-inner-container.content.faded-out {
        background-color: #fcfcfc
    }

    .fs-container {
        height: 100%;
        width: 100%
    }

    .fs-container #map-container {
        position: relative;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        z-index: 990;
        margin-bottom: 0
    }

    .fs-content {
        max-height: 100%;
        padding: 0
    }

    .fs-container section.search {
        padding: 45px 40px;
        background-color: #fff
    }

    .fs-container .fs-listings {
        padding: 0 25px;
        margin: 0
    }

    .fs-switcher {
        padding: 0 25px;
        margin: 0
    }

    .fs-inner-container {
        width: 50%;
        float: left;
        display: inline-block
    }

    .fs-inner-container.content {
        width: 55%;
        background-color: #f7f7f7;
        z-index: 995;
        box-shadow: 0 0 12px 0 rgba(0, 0, 0, .12);
        position: relative;
        padding-top: 80px
    }

    .fs-inner-container {
        width: 45%;
        background-color: #fff;
        z-index: 10
    }

    .fs-inner-container.map-fixed {
        height: 100vh;
        position: fixed;
        top: 0;
        padding-top: 80px
    }

    .infoBox {
        border-radius: 4px
    }

    .map-box {
        background-color: #fff;
        margin-bottom: 20px;
        border-radius: 4px;
        box-shadow: 0 0 10px 0 rgba(0,0,0,.12);
        position: relative
    }

    .map-box .listing-img-container img {
        width: 100%;
        border-radius: 4px 4px 0 0
    }

    .map-box h4 {
        margin: 0;
        padding: 0
    }

    .map-box h4 a {
        padding: 0 0 2px;
        font-size: 17px;
        line-height: 25px;
        -webkit-transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -ms-transition: all .2s ease-in-out;
        -o-transition: all .2s ease-in-out;
        transition: all .2s ease-in-out;
        display: inline-block
    }

    .listing-img-container {
        position: relative;
        height: 100%;
        display: block
    }

    .map-box h4 a:hover {
        color: #66676b
    }
.gm-style {
    font: 400 15px Roboto, Arial, sans-serif !important;
    } 
    .map-box p {
        padding: 0;
        line-height: 25px;
        margin: 2px 0 0;
        font-size: 14px
    }

    .map-box ul.listing-details {
        padding: 0;
        font-size: 14px;
        display: none
    }

    .map-box .listing-title {
        padding: 6px 20px
    }

    .map-box .listing-img-content {
        padding: 18px 22px
    }

    .map-box .listing-img-content span {
        font-size: 21px
    }

    .map-box .listing-img-content .listing-price i {
        font-size: 15px;
        margin: -7px 0 0
    }

    .map-box .listing-img-container::before {
        content: "";
        position: absolute;
        height: 100%;
        width: 100%;
        display: block;
        background: linear-gradient(to top,rgba(35,35,37,0.85) 0%,rgba(35,35,37,0.40) 35%,rgba(22,22,23,0) 60%,rgba(0,0,0,0) 100%);
        background-color: rgba(35,35,37,.2)
    }

    .map-box .listing-item-content {
        position: absolute;
        bottom: 20px;
        left: 0;
        padding: 0 24px;
        width: 100%;
        z-index: 50;
        box-sizing: border-box
    }

    .map-box .listing-item-content h3 {
        color: #fff;
        font-size: 18px;
        padding: 0 0 2px;
        font-weight: 500;
        margin: 0;
        line-height: 27px
    }

    .map-box .listing-item-content span {
        font-size: 15px;
        font-weight: 300;
        display: inline-block;
        color: rgba(255,255,255,.7)
    }

    .infoBox-close {
        position: absolute;
        top: 10px;
        right: 10px;
        display: inline-block;
        z-index: 999;
        text-align: center;
        line-height: 29px;
        cursor: pointer;
        font-size: 15px;
        font-weight: 500;
        height: 29px;
        width: 29px;
        background-color: #fff;
        color: #333;
        -webkit-transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -o-transition: all .2s ease-in-out;
        -ms-transition: all .2s ease-in-out;
        transition: all .2s ease-in-out;
        font-family: fontawesome;
        border-radius: 50%;
        -webkit-text-stroke: 1px #fff
    }

    .infoBox-close:hover {
        color: #fff;
        background-color: #66676b;
        -webkit-text-stroke: 1px #66676b
    }

    .map-box-icon {
        height: 38px;
        width: 38px;
        position: absolute;
        bottom: 0;
        right: 0;
        background-color: #3685cf;
        display: block;
        color: #fff;
        font-size: 12px;
        z-index: 101;
        text-align: center;
        -webkit-transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -o-transition: all .2s ease-in-out;
        -ms-transition: all .2s ease-in-out;
        transition: all .2s ease-in-out;
        -webkit-transform: translateX(50%);
        -ms-transform: translateX(50%);
        transform: translateX(50%);
        opacity: 0;
        visibility: hidden
    }

    .map-box-icon:before {
        content: "\f064";
        font-family: fontawesome;
        position: relative;
        top: 7px;
        display: block
    }

    .map-box-image:hover .map-box-icon {
        opacity: 1;
        visibility: visible;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateX(0)
    }

    .map-box-image {
        position: relative;
        overflow: hidden;
        display: block
    }

    .infoBox {
        -webkit-animation: fadeIn .9s;
        animation: fadeIn .9s
    }

    @-webkit-keyframes fadeIn {
        from {
            opacity: 0
        }

        to {
            opacity: 1
        }
    }

    @keyframes fadeIn {
        from {
            opacity: 0
        }

        to {
            opacity: 1
        }
    }

    .infoBox .star-rating {
        font-size: 16px;
        margin-top: 1px
    }

    .infoBox .star-rating span {
        margin-right: 3px
    }

    .infoBox .rating-counter {
        position: relative;
        top: -1px
    }

    .infoBox:after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 0;
        height: 0;
        border-left: 20px solid transparent;
        border-right: 20px solid transparent;
        border-top: 20px solid #fff
    }

    .map-get {
        height: 100%;
        width: 100%;
        margin: 0;
        z-index: 990
    }

    .gmnoprint {
        margin: 10px
    }

    #map-container.fullwidth-home-map {
        height: 620px;
        margin-bottom: 0
    }

    #map-container.fullwidth-home-map .main-search-inner {
        position: absolute;
        display: block;
        bottom: 60px;
        top: auto;
        transform: none;
        padding-bottom: 0;
        z-index: 9999;
        margin-top: 0;
        margin-left: auto;
        margin-right: auto;
        width: 100%
    }

    #map-container.fullwidth-home-map .main-search-input {
        margin-top: 0
    }

    .cluster img {
        display: none
    }

    .cluster-visible {
        text-align: center;
        font-size: 15px!important;
        color: #fff!important;
        font-weight: 500;
        border-radius: 50%;
        width: 36px!important;
        height: 36px!important;
        line-height: 36px!important;
        background-color: #66676b
    }

    .cluster-visible:before {
        border: 7px solid #66676b;
        opacity: .2;
        box-shadow: inset 0 0 0 4px #66676b;
        content: '';
        position: absolute;
        border-radius: 50%;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        animation: cluster-animation 2.5s infinite
    }

    @keyframes cluster-animation {
        0%,100% {
            transform: scale(1.3) rotate(0deg)
        }

        50% {
            transform: scale(1.5) rotate(90deg)
        }
    }

    .map-marker-container {
        position: absolute;
        margin-top: 10px;
        transform: translate3d(-50%,-100%,0)
    }

    .marker-container {
        position: relative;
        margin: 10px auto;
        width: 40px;
        height: 40px;
        z-index: 1;
        border-radius: 50%;
        cursor: pointer;
        top: -5px
    }

    #singleListingMap .marker-container {
        cursor: default
    }

    .marker-container {
        perspective: 1000
    }

    .marker-card {
        width: 100%;
        height: 100%;
        transform-style: preserve-3d;
        transition: all .4s ease-in-out;
        position: absolute;
        z-index: 1
    }

    .marker-container:hover .marker-card,.map-marker-container.clicked .marker-card {
        transform: rotateY(180deg) translateY(-4px)
    }

    .marker-arrow {
        width: 0;
        content: "";
        height: 0;
        border-style: solid;
        border-width: 8px 4px 0;
        border-color: #66676b transparent transparent;
        top: 38px;
        left: 50%;
        transform: translateX(-50%);
        position: absolute;
        border-radius: 50%;
        z-index: 1
    }

    .face {
        position: absolute;
        width: 100%;
        height: 100%;
        backface-visibility: hidden;
        text-align: center;
        border-radius: 50%;
        color: #fff;
        z-index: 100
    }

    .face i {
        line-height: 34px;
        font-size: 20px
    }

    .face.front {
        background-color: #fff;
        border: 2px solid #66676b;
        color: #66676b;
        z-index: 100
    }

    .face.back {
        transform: rotateY(180deg);
        box-sizing: border-box;
        background: #66676b;
        border-color: #66676b;
        color: #fff
    }

    .face.back i {
        trasform: scaleX(-1);
        line-height: 38px;
        font-size: 18px
    }

    .face.back:after {
        content: "";
        display: block;
        width: 36px;
        height: 36px;
        top: 2px;
        left: 2px;
        border: 1px solid rgba(255,255,255,.65);
        border-radius: 50%;
        position: absolute
    }

    .custom-zoom-in,.custom-zoom-out {
        background-color: #fff;
        color: #333;
        cursor: pointer;
        border-radius: 50%;
        margin: 5px 15px;
        transition: color .3s,background-color .3s;
        box-shadow: 0 1px 4px -1px rgba(0,0,0,.2);
        text-align: center;
        font-size: 15px;
        height: 34px;
        width: 34px
    }

    .custom-zoom-in:hover,.custom-zoom-out:hover {
        background-color: #66676b;
        color: #fff
    }

    .custom-zoom-in:before,.custom-zoom-out:before {
        font-family: fontawesome;
        width: 100%;
        line-height: 35px;
        transition: -webkit-text-stroke .3s;
        -webkit-text-stroke: 1px #fff
    }

    .zoomControlWrapper {
        position: absolute;
        left: 0;
        right: auto;
        width: 70px
    }

    .custom-zoom-in:before {
        content: "\f067"
    }

    .custom-zoom-out:before {
        content: "\f068"
    }

    .custom-zoom-in:hover:before,.custom-zoom-out:hover:before {
        -webkit-text-stroke: 1px #66676b
    }

    #mapnav-buttons {
        position: absolute;
        transform: translate(0,0);
        z-index: 999;
        font-size: 14px;
        display: inline-block;
        bottom: 20px;
        right: 20px;
        list-style: none;
        padding: 0
    }

    #mapnav-buttons.top {
        top: 20px;
        right: 20px;
        bottom: auto
    }

    #mapnav-buttons li {
        float: left;
        margin-left: 4px;
        line-height: 20px
    }

    #streetView,#geoLocation,#scrollEnabling,#mapnav-buttons a {
        color: #333;
        background-color: #fff;
        padding: 7px 18px;
        padding-top: 9px;
        font-weight: 500;
        -webkit-transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -o-transition: all .2s ease-in-out;
        -transition: all .2s ease-in-out;
        box-sizing: border-box;
        display: inline-block;
        border-radius: 50px;
        box-shadow: 0 1px 4px -1px rgba(0,0,0,.2)
    }

    #geoLocation:hover,#streetView:hover,#scrollEnabling:hover,#scrollEnabling.enabled,#mapnav-buttons a:hover {
        background-color: #66676b;
        color: #fff
    }

    #prevpoint:before,#nextpoint:after {
        font-family: fontawesome;
        position: relative;
        font-weight: 500;
        margin: 0 0 0 6px;
        font-size: 17px;
        top: 0;
        line-height: 1px
    }

    #prevpoint:before {
        content: "\f104";
        margin: 0 6px 0 0
    }

    #nextpoint:after {
        content: "\f105";
        margin: 0 0 0 6px
    }

    #streetView,#geoLocation,#scrollEnabling {
        position: absolute;
        top: 20px;
        right: 20px;
        z-index: 999;
        font-size: 13px;
        line-height: 21px
    }

    #streetView:before,#geoLocation:before,#scrollEnabling:before {
        content: "\e015";
        font-family: simple-line-icons;
        position: relative;
        top: 2px;
        margin: 0 6px 0 0;
        font-size: 15px;
        line-height: 1px
    }

    #scrollEnabling:before {
        margin-left: -3px
    }

    #streetView:before {
        content: "\f21d";
        font-family: fontawesome;
        font-size: 16px;
        top: 1px;
        margin-right: 8px
    }

    #geoLocation {
        right: auto;
        left: 20px;
        padding: 8px 11px
    }

    #geoLocation:before {
        content: "\f192";
        font-family: fontawesome;
        font-size: 16px;
        margin: 0;
        top: 2px
    }

    @-webkit-keyframes passing-through {
        0% {
            opacity: 0;
            -webkit-transform: translateY(40px);
            -moz-transform: translateY(40px);
            -ms-transform: translateY(40px);
            -o-transform: translateY(40px);
            transform: translateY(40px)
        }

        30%,70% {
            opacity: 1;
            -webkit-transform: translateY(0px);
            -moz-transform: translateY(0px);
            -ms-transform: translateY(0px);
            -o-transform: translateY(0px);
            transform: translateY(0px)
        }

        100% {
            opacity: 0;
            -webkit-transform: translateY(-40px);
            -moz-transform: translateY(-40px);
            -ms-transform: translateY(-40px);
            -o-transform: translateY(-40px);
            transform: translateY(-40px)
        }
    }

    @-moz-keyframes passing-through {
        0% {
            opacity: 0;
            -webkit-transform: translateY(40px);
            -moz-transform: translateY(40px);
            -ms-transform: translateY(40px);
            -o-transform: translateY(40px);
            transform: translateY(40px)
        }

        30%,70% {
            opacity: 1;
            -webkit-transform: translateY(0px);
            -moz-transform: translateY(0px);
            -ms-transform: translateY(0px);
            -o-transform: translateY(0px);
            transform: translateY(0px)
        }

        100% {
            opacity: 0;
            -webkit-transform: translateY(-40px);
            -moz-transform: translateY(-40px);
            -ms-transform: translateY(-40px);
            -o-transform: translateY(-40px);
            transform: translateY(-40px)
        }
    }

    @keyframes passing-through {
        0% {
            opacity: 0;
            -webkit-transform: translateY(40px);
            -moz-transform: translateY(40px);
            -ms-transform: translateY(40px);
            -o-transform: translateY(40px);
            transform: translateY(40px)
        }

        30%,70% {
            opacity: 1;
            -webkit-transform: translateY(0px);
            -moz-transform: translateY(0px);
            -ms-transform: translateY(0px);
            -o-transform: translateY(0px);
            transform: translateY(0px)
        }

        100% {
            opacity: 0;
            -webkit-transform: translateY(-40px);
            -moz-transform: translateY(-40px);
            -ms-transform: translateY(-40px);
            -o-transform: translateY(-40px);
            transform: translateY(-40px)
        }
    }

    @-webkit-keyframes slide-in {
        0% {
            opacity: 0;
            -webkit-transform: translateY(40px);
            -moz-transform: translateY(40px);
            -ms-transform: translateY(40px);
            -o-transform: translateY(40px);
            transform: translateY(40px)
        }

        30% {
            opacity: 1;
            -webkit-transform: translateY(0px);
            -moz-transform: translateY(0px);
            -ms-transform: translateY(0px);
            -o-transform: translateY(0px);
            transform: translateY(0px)
        }
    }

    @-moz-keyframes slide-in {
        0% {
            opacity: 0;
            -webkit-transform: translateY(40px);
            -moz-transform: translateY(40px);
            -ms-transform: translateY(40px);
            -o-transform: translateY(40px);
            transform: translateY(40px)
        }

        30% {
            opacity: 1;
            -webkit-transform: translateY(0px);
            -moz-transform: translateY(0px);
            -ms-transform: translateY(0px);
            -o-transform: translateY(0px);
            transform: translateY(0px)
        }
    }

    @keyframes slide-in {
        0% {
            opacity: 0;
            -webkit-transform: translateY(40px);
            -moz-transform: translateY(40px);
            -ms-transform: translateY(40px);
            -o-transform: translateY(40px);
            transform: translateY(40px)
        }

        30% {
            opacity: 1;
            -webkit-transform: translateY(0px);
            -moz-transform: translateY(0px);
            -ms-transform: translateY(0px);
            -o-transform: translateY(0px);
            transform: translateY(0px)
        }
    }

    @-webkit-keyframes pulse {
        0% {
            -webkit-transform: scale(1);
            -moz-transform: scale(1);
            -ms-transform: scale(1);
            -o-transform: scale(1);
            transform: scale(1)
        }

        10% {
            -webkit-transform: scale(1.1);
            -moz-transform: scale(1.1);
            -ms-transform: scale(1.1);
            -o-transform: scale(1.1);
            transform: scale(1.1)
        }

        20% {
            -webkit-transform: scale(1);
            -moz-transform: scale(1);
            -ms-transform: scale(1);
            -o-transform: scale(1);
            transform: scale(1)
        }
    }

    @-moz-keyframes pulse {
        0% {
            -webkit-transform: scale(1);
            -moz-transform: scale(1);
            -ms-transform: scale(1);
            -o-transform: scale(1);
            transform: scale(1)
        }

        10% {
            -webkit-transform: scale(1.1);
            -moz-transform: scale(1.1);
            -ms-transform: scale(1.1);
            -o-transform: scale(1.1);
            transform: scale(1.1)
        }

        20% {
            -webkit-transform: scale(1);
            -moz-transform: scale(1);
            -ms-transform: scale(1);
            -o-transform: scale(1);
            transform: scale(1)
        }
    }

    @keyframes pulse {
        0% {
            -webkit-transform: scale(1);
            -moz-transform: scale(1);
            -ms-transform: scale(1);
            -o-transform: scale(1);
            transform: scale(1)
        }

        10% {
            -webkit-transform: scale(1.1);
            -moz-transform: scale(1.1);
            -ms-transform: scale(1.1);
            -o-transform: scale(1.1);
            transform: scale(1.1)
        }

        20% {
            -webkit-transform: scale(1);
            -moz-transform: scale(1);
            -ms-transform: scale(1);
            -o-transform: scale(1);
            transform: scale(1)
        }
    }

    .dropzone,.dropzone * {
        box-sizing: border-box
    }

    .dropzone {
        min-height: 150px;
        border: 2px solid rgba(0,0,0,.3);
        background: #fff;
        padding: 20px
    }

    .dropzone.dz-clickable {
        cursor: pointer
    }

    .dropzone.dz-clickable * {
        cursor: default
    }

    .dropzone.dz-clickable .dz-message,.dropzone.dz-clickable .dz-message * {
        cursor: pointer
    }

    .dropzone.dz-started .dz-message {
        display: none
    }

    .dropzone.dz-drag-hover {
        border-style: solid
    }

    .dropzone.dz-drag-hover .dz-message {
        opacity: .5
    }

    .dropzone .dz-preview {
        position: relative;
        display: inline-block;
        vertical-align: top;
        margin: 16px;
        min-height: 100px
    }

    .dropzone .dz-preview:hover {
        z-index: 1000
    }

    .dropzone .dz-preview:hover .dz-details {
        opacity: 1
    }

    .dropzone .dz-preview.dz-file-preview .dz-image {
        border-radius: 3px;
        background: #999;
        background: linear-gradient(to bottom,#eee,#ddd)
    }

    .dropzone .dz-preview.dz-file-preview .dz-details {
        opacity: 1
    }

    .dropzone .dz-preview.dz-image-preview {
        background: #fff
    }

    .dropzone .dz-preview.dz-image-preview .dz-details {
        -webkit-transition: opacity .2s linear;
        -moz-transition: opacity .2s linear;
        -ms-transition: opacity .2s linear;
        -o-transition: opacity .2s linear;
        transition: opacity .2s linear
    }

    .dropzone .dz-preview .dz-remove {
        font-size: 14px;
        text-align: center;
        display: block;
        cursor: pointer;
        border: none
    }

    .dropzone .dz-preview .dz-remove:hover {
        text-decoration: underline
    }

    .dropzone .dz-preview:hover .dz-details {
        opacity: 1
    }

    .dropzone .dz-preview .dz-details {
        z-index: 20;
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0;
        font-size: 13px;
        min-width: 100%;
        max-width: 100%;
        padding: 2em 1em;
        text-align: center;
        color: rgba(0,0,0,.9);
        line-height: 150%
    }

    .dropzone .dz-preview .dz-details .dz-size {
        margin-bottom: 1em;
        font-size: 16px
    }

    .dropzone .dz-preview .dz-details .dz-filename {
        white-space: nowrap
    }

    .dropzone .dz-preview .dz-details .dz-filename:hover span {
        border: 1px solid rgba(200,200,200,.8);
        background-color: rgba(255,255,255,.8)
    }

    .dropzone .dz-preview .dz-details .dz-filename:not(:hover) {
        overflow: hidden;
        text-overflow: ellipsis
    }

    .dropzone .dz-preview .dz-details .dz-filename:not(:hover) span {
        border: 1px solid transparent
    }

    .dropzone .dz-preview .dz-details .dz-filename span,.dropzone .dz-preview .dz-details .dz-size span {
        background-color: rgba(255,255,255,.4);
        padding: 0 .4em;
        border-radius: 3px
    }

    .dropzone .dz-preview:hover .dz-image img {
        -webkit-transform: scale(1.05,1.05);
        -moz-transform: scale(1.05,1.05);
        -ms-transform: scale(1.05,1.05);
        -o-transform: scale(1.05,1.05);
        transform: scale(1.05,1.05);
        -webkit-filter: blur(8px);
        filter: blur(8px)
    }

    .dropzone .dz-preview .dz-image {
        border-radius: 3px;
        overflow: hidden;
        width: 120px;
        height: 120px;
        position: relative;
        transition: all .3s;
        display: block;
        z-index: 10
    }

    .dropzone .dz-preview .dz-image img {
        display: block;
        filter: blur(0px);
        transition: all .4s
    }

    .dropzone .dz-preview.dz-success .dz-success-mark {
        -webkit-animation: passing-through 3s cubic-bezier(.77,0,.175,1);
        -moz-animation: passing-through 3s cubic-bezier(.77,0,.175,1);
        -ms-animation: passing-through 3s cubic-bezier(.77,0,.175,1);
        -o-animation: passing-through 3s cubic-bezier(.77,0,.175,1);
        animation: passing-through 3s cubic-bezier(.77,0,.175,1)
    }

    .dropzone .dz-preview.dz-error .dz-error-mark {
        opacity: 1;
        -webkit-animation: slide-in 3s cubic-bezier(.77,0,.175,1);
        -moz-animation: slide-in 3s cubic-bezier(.77,0,.175,1);
        -ms-animation: slide-in 3s cubic-bezier(.77,0,.175,1);
        -o-animation: slide-in 3s cubic-bezier(.77,0,.175,1);
        animation: slide-in 3s cubic-bezier(.77,0,.175,1)
    }

    .dropzone .dz-preview .dz-success-mark,.dropzone .dz-preview .dz-error-mark {
        pointer-events: none;
        opacity: 0;
        z-index: 500;
        position: absolute;
        display: block;
        top: 50%;
        left: 50%;
        margin-left: -27px;
        margin-top: -27px
    }

    .dropzone .dz-preview .dz-success-mark svg,.dropzone .dz-preview .dz-error-mark svg {
        display: block;
        width: 54px;
        height: 54px
    }

    .dropzone .dz-preview.dz-processing .dz-progress {
        opacity: 1;
        -webkit-transition: all .2s linear;
        -moz-transition: all .2s linear;
        -ms-transition: all .2s linear;
        -o-transition: all .2s linear;
        transition: all .2s linear
    }

    .dropzone .dz-preview.dz-complete .dz-progress {
        opacity: 0;
        -webkit-transition: opacity .4s ease-in;
        -moz-transition: opacity .4s ease-in;
        -ms-transition: opacity .4s ease-in;
        -o-transition: opacity .4s ease-in;
        transition: opacity .4s ease-in
    }

    .dropzone .dz-preview:not(.dz-processing) .dz-progress {
        -webkit-animation: pulse 6s ease infinite;
        -moz-animation: pulse 6s ease infinite;
        -ms-animation: pulse 6s ease infinite;
        -o-animation: pulse 6s ease infinite;
        animation: pulse 6s ease infinite
    }

    .dropzone .dz-preview .dz-progress {
        opacity: 1;
        z-index: 1000;
        pointer-events: none;
        position: absolute;
        height: 16px;
        left: 50%;
        top: 50%;
        margin-top: -8px;
        width: 80px;
        margin-left: -40px;
        background: rgba(255,255,255,.9);
        -webkit-transform: scale(1);
        border-radius: 8px;
        overflow: hidden
    }

    .dropzone .dz-preview .dz-progress .dz-upload {
        background: #333;
        background: linear-gradient(to bottom,#666,#444);
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        width: 0;
        -webkit-transition: width 300ms ease-in-out;
        -moz-transition: width 300ms ease-in-out;
        -ms-transition: width 300ms ease-in-out;
        -o-transition: width 300ms ease-in-out;
        transition: width 300ms ease-in-out
    }

    .dropzone .dz-preview.dz-error .dz-error-message {
        display: block
    }

    .dropzone .dz-preview.dz-error:hover .dz-error-message {
        opacity: 1;
        pointer-events: auto
    }

    .dropzone .dz-preview .dz-error-message {
        pointer-events: none;
        z-index: 1000;
        position: absolute;
        display: block;
        display: none;
        opacity: 0;
        -webkit-transition: opacity .3s ease;
        -moz-transition: opacity .3s ease;
        -ms-transition: opacity .3s ease;
        -o-transition: opacity .3s ease;
        transition: opacity .3s ease;
        font-size: 13px;
        top: 130px;
        left: -10px;
        width: 140px;
        background: #be2626;
        background: linear-gradient(to bottom,#be2626,#a92222);
        border-radius: 4px;
        padding: 10px 15px;
        line-height: 18px;
        color: #fff
    }

    .dropzone .dz-preview .dz-error-message:after {
        content: '';
        position: absolute;
        top: -6px;
        left: 64px;
        width: 0;
        height: 0;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-bottom: 6px solid #be2626
    }

    .dropzone {
        position: relative;
        border: 2px dashed #d0d0d0;
        border-radius: 3px;
        background: #fcfcfc;
        transition: all .3s linear;
        margin-bottom: 10px;
        margin-top: 5px;
        display: inline-block;
        width: 100%
    }

    .dropzone:hover {
        border: 2px dashed #59b02c;
        background: #fff;
        transition: all .35s linear
    }

    .dropzone:before {
        position: absolute;
        height: 100%;
        width: 100%;
        content: "";
        top: 0;
        left: 0;
        background: linear-gradient(to bottom,rgba(255,255,255,0.95),rgba(255,255,255,0.9));
        background-color: #59b02c;
        opacity: 0;
        z-index: 10;
        transition: all .3s linear;
        border-radius: 3px
    }

    .dropzone:hover:before {
        opacity: .4
    }

    .dropzone .dz-message {
        text-align: center;
        margin: 50px 0;
        font-size: 17px;
        color: #888;
        transition: all .3s linear;
        position: relative;
        z-index: 11
    }

    .dropzone:hover .dz-message {
        color: #59b02c
    }

    .dz-message i {
        display: block;
        font-size: 32px;
        margin-bottom: 15px
    }
@media (min-width: 768px) and (max-width: 1200px) {
	#mainNav .navbar-nav>li.nav-item>a {
    font-size: 11px;
        margin: 0 12px;
}
.navbar-nav li>a::before {
    left: -9px;
    top: 3px;
    }
    .ipadpro {
	    display:block;
	    width:100%;
    }
    .noipadpro {
	    display:none;
    }
}
@media (min-width: 500px) and (max-width: 768px) {
	.list1 .listsp .col-lg-8 {
		width:100%;
	}
	.list2 {
		    width: 100%
	}
	.classsp2 {
		padding-left:8px;
		padding-right:8px;
	}
	.hiddenm {
	    display:none;
    }
	}
@media (max-width: 500px) {
	.bookslide {
		margin-top:20px;
		margin-bottom:60px;
	}
.bando {padding-left:0;}
.itemtailieu {
    width: 49%;
    margin-bottom: 100px;
}
.fixed-right {
	display:none;
}
.cot50 {
	width:48%;
}
.hiddenm {
	display:none;
}
footer .col-lg-4 {
	width:50%;
}
footer .col-lg-4 ul {
	padding-left:0;
	margin:18px 0;
}
footer .col-lg-8.text-right {
	text-align:left !important;
}
.maincontenthome {
	display:none;
}
.maincontenthomem {
	display:block;
}
.tensp span {
    font-size:16px;
}
.tieude span {
    font-size:18px;
}
.imgcat {height:320px;}
.infocat {
    width: 66%;
    margin:0 auto;
    top: 53%;
    } 
element.style {
}
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12, .col-xs-13, .col-sm-13, .col-md-13, .col-lg-13, .col-xs-14, .col-sm-14, .col-md-14, .col-lg-14, .col-xs-15, .col-sm-15, .col-md-15, .col-lg-15, .col-xs-16, .col-sm-16, .col-md-16, .col-lg-16, .col-xs-17, .col-sm-17, .col-md-17, .col-lg-17, .col-xs-18, .col-sm-18, .col-md-18, .col-lg-18, .col-xs-19, .col-sm-19, .col-md-19, .col-lg-19, .col-xs-20, .col-sm-20, .col-md-20, .col-lg-20, .col-xs-21, .col-sm-21, .col-md-21, .col-lg-21, .col-xs-22, .col-sm-22, .col-md-22, .col-lg-22, .col-xs-23, .col-sm-23, .col-md-23, .col-lg-23, .col-xs-24, .col-sm-24, .col-md-24, .col-lg-24 {
    float:none;
}
.col-lg-6.list2 {
	width: 100%;
}
.h2catsp {
    margin-bottom: 45px;
    margin-top:45px;
}
.categorysp h2 span {
    font-size: 25px;
}
.item h4 {
    min-height: 30px;
        font-size: 17px;
    }
    
.navbar-nav li>a::before {
    top: 11px;
    }
 .infotailieu {
    top: 46%;
    font-size: 13px;  
    } 
    #mainNav .navbar-brand {
    width: 60%;
    }
    .navbar-light .navbar-nav .nav-link {
        color: #3a87c3;
        }
    .categorysp .col-lg-18 {
	    padding-left:0;
	    padding-right:0;
	    width: 100%;
    }
    .categorysp .col-lg-6 {
	    padding-left:0;
	    padding-right:0;
    }
      .whitebg {
    max-width: 260px;
    }
    .gioithieunew  {
	    margin-left:-22px;
    }
    .container22 {
    height: 450px;
    animation: container222 1000s ease infinite;
}
@-webkit-keyframes container222 {
  0%{
	  opacity:1;
	  height: 450px;
	  
  }
  0.61%{opacity:1;
	  height: 450px;
  }
  0.62%{opacity:.9;
	  height: 450px;

  }
0.7%{
	opacity:0;
	height: 450px;
	display: none;
}
  0.705%{
	  opacity:0;
	  height:0;
	  display: none;
  
  }
  100%{
	  opacity:0;
	  height:0;
    display: none;
  }
  }
  
    
  
  .new223,
  .new333,
  .new44,
  .new55,
  .new11{
  left:12%;
  bottom:80px;
  }
  .new11{
  animation: drop 300s ease infinite;
}
@-webkit-keyframes drop {
  0%{
	  opacity:0;
     transform:scale(0.1,0.1);
    bottom:80px;
    border-top-left-radius: 50%;
  }
  0.66%{
	  opacity:0;
     transform:scale(0.1,0.1);
    bottom:80px;
    border-top-left-radius: 50%;
  }
  0.80%{
	  opacity:.3;
     transform:scale(0.1,0.1);
    bottom:80px;
    border-top-left-radius: 50%;
  }
0.90%{
	opacity:1;
  bottom:80px;
  border-top-left-radius: 0;
}
  1.01%{
	  opacity:1;
	  bottom:80px;
    border-top-left-radius: 0;
  transform:scale(1,1);
  }
1.5%{
    bottom:80px;
    opacity:1;
  border-top-left-radius: 0;
  transform:scale(1,1);
  
  }
  100%{
    bottom:120px;
    opacity:1;
  border-top-left-radius: 0;
  transform:scale(1,1);
  
  }
  }
  .khunghome {
	  height: 450px;
	  animation: khunghomem 1000s ease infinite;
}
@-webkit-keyframes khunghomem {
  0%{
	  height: 450px;
	  
  }
  0.61%{
	  height: 450px;
  }
  0.62%{
	  height: 550px;

  }
0.7%{
	height: 550px;
}
  0.705%{
	  height: 550px;  }
  100%{
	  height: 550px;
  }
  
	  }
	  
.layer23 {
    position: absolute;
    width: 102px;
    height: 55px;
    top: 410px;
    left: 56px;
    z-index: 999;
    cursor: pointer;
}
	  

  .khungbep {
    width: 98%;
    height: 172px;
    top: 198px;
    left: 1%;
}
.spbep1 {
    position: absolute;
    width: 26px;
    height: 25px;
    top: 34px;
    left: 90px;
    z-index: 1999;
}

.spbep2 {
    position: absolute;
    width: 26px;
    height: 26px;
    top: 34px;
    left: 119px;
    z-index: 1999;
}
.spbep3 {
    position: absolute;
    width: 28px;
    height: 26px;
    top: 34px;
    left: 210px;
    z-index: 1999;
}
.spbep4 {
    position: absolute;
    width: 28px;
    height: 26px;
    top: 34px;
    left: 239px;
    z-index: 1999;
}
.spbep5 {
    position: absolute;
    width: 28px;
    height: 26px;
    top: 34px;
    left: 269px;
    z-index: 1999;
}
.spbep6 {
    position: absolute;
    width: 28px;
    height: 26px;
    top: 34px;
    left: 297px;
    z-index: 1999;
}
.clickicon {
    display: none;
    position: absolute;
    top: 368px;
    left: 82px;
}
.clickicon img {
    width: 26px;
    height: auto;
}
.col-md-24 {
	width:100%;
}
.spcungloai {
	padding-left:0;
	padding-right:0;
}
.spcungloai .col6 {
	margin:0 3px;
}
.spcungloai .item h4 {
    min-height: 30px;
    font-size: 8px;
}
.layer21 {
    position: absolute;
    width: 12px;
    height: 40px;
    top: 378px;
    left: 70px;
    z-index: 999;
    cursor: pointer;
}
.layer22 {
    position: absolute;
    width: 20px;
    height: 40px;
    top: 298px;
    left: 16px;
    z-index: 999;
    cursor: pointer;
}
.layer24 {
    position: absolute;
    width: 12px;
    height: 30px;
    top: 385px;
    left: 160px;
    z-index: 999;
    cursor: pointer;
}
.layer25 {
    position: absolute;
    width: 12px;
    height: 30px;
    top: 430px;
    left: 246px;
    z-index: 999;
    cursor: pointer;
}
.khungpopup iframe {
	width:300px;
	height:190px;
}
.thongtinsp div,
.thongtinsp table {
	max-width:100%;
}
.thongtinsp table {
	width:100% !important;
	} 
.nav.panel-tabs	li {
	    width: 100%;
    text-align: center;
    }
}

@media (min-width: 351px) and (max-width: 500px) {
	
.text01m img {
	width:263px;
}
}


@media (max-width: 350px) {
	.maincontenthomem {
    	width: 320px;
    }
	.mohinhm {
    width: 320px;
    }
    .new223, .new333, .new44, .new55, .new11 {
    left: 5%;
    bottom: 80px;
}
.dongsuoi1m img {
    width: 230px;
}
.doinui1m {
    top: -6px;
    }
    .binhtongm {
    top: 248px;
    }
.nhanoithatm {
    top: 235px;
    }
    .khungnham {
    top: 237px;
    }
    .binhlocnuocm {
    top: 235px;
    }
    .layer1m {
    top: 390px;
    left: 23px;
    width: 233px;
    }
    .layer2m {
    left: 53px;
    }
    .layer3m {
    width: 12px;
    }
    .layer4m {
    left: 142px;
    }
    .layer5m {
    left: 142px;
    width: 7px;
    }
    .layer7am {
    top: 368px;
    left: 222px;
    }
    .layer7m {
    top: 381px;
    left: 107px;
    width: 7px;
    }
    .layer6m {
    left: 104px;
    }
    .layer9m {
    left: 233px;
    width: 12px;
    }
    .layer10m {
    left: 245px;
    }
    .layer23 {
    width: 92px;
    height: 45px;
    }
    .layer22 {
    width: 18px;
    height: 36px;
    top: 297px;
    }
    .layer24 {
    top: 390px;
    }
    .layer25 {
    width: 11px;
    height: 35px;
    top: 426px;
    }
    .binhlocnuoc1m {
    position: absolute;
    top: 382px;
    left: 66px;
    z-index: 109;
    width: 7px;
    height: 25px;
	 -webkit-animation: binhlocnuoc1 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: binhlocnuoc1 1000s infinite;
}
.binhlocnuoc2m {
    position: absolute;
    top: 392px;
    left: 150px;
    z-index: 109;
    width: 4px;
    height: 18px;
	 -webkit-animation: binhlocnuoc1 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: binhlocnuoc1 1000s infinite;
}
.binhlocnuoc3m {
    position: absolute;
    top: 291px;
    left: 22px;
    z-index: 109;
    width: 9px;
    height: 26px;
	 -webkit-animation: binhlocnuoc1 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: binhlocnuoc1 1000s infinite;
}
.binhlocnuoc4m {
    position: absolute;
    top: 428px;
    left: 228px;
    z-index: 109;
    width: 5px;
    height: 19px;
	 -webkit-animation: binhlocnuoc1 1000s infinite; /* Safari 4.0 - 8.0 */
  animation: binhlocnuoc1 1000s infinite;
}
    
    .gioithieunew {
    width: 320px;
    }
    .cham11 {
    left: 170px;
    top: 123px;
    }
    .khung11 {
    top: 125px;
    -webkit-animation-name: Khung1a !important;
    animation-name: Khung1a !important;
    }
    .text11 {
    width: 100px;
    font-size: 10px;
}
.cham22 {
    top: 183px;
    left: 152px;
    }
    .text22 {
    top: 166px;
    font-size: 10px;
}
.khung22 {
    top: 185px;
    -webkit-animation-name: Khung2a !important;
    animation-name: Khung2a !important;
    }
.cham33 {
    top: 123px;
    left: 195px;
    }
    .khung33 {
    top: 125px;
    left: 200px;
    }
    .text33 {
    top: 108px;
    left: 220px;
    width: 100px;
    font-size: 10px;
    }
    .cham44 {
    top: 183px;
    left: 195px;
    }
    .khung44 {
    top: 185px;
    left: 195px;
    }
    .text44 {
    top: 156px;
    left: 220px;
    width: 100px;
    line-height: 13px;
    font-size: 10px;
}
@-webkit-keyframes Khung1a {
  0% {
    width: 0;
  }
  50% {
    width: 0;
  }
  100% {
    width: 170px;
    left: 2px;
  }
}
@keyframes Khung1a {
  0% {
    width: 0;
  }
  50% {
    width: 0;
  }
  100% {
    width: 170px;
    left: 2px;
  }
}
@-webkit-keyframes Khung2a {
  0% {
    width: 0;
  }
  50% {
    width: 0;
  }
  
  100% {
    width: 150px;
    left: 2px;
  }
}
@keyframes Khung2a {
  0% {
    width: 0;
  }
  50% {
    width: 0;
  }
  
  100% {
    width: 150px;
    left: 2px;
  }
}



	}