// Các chức năng mặc định
/* vietnamese */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v10/SKK6Nusyv8QPNMtI4j9J2yEAvth_LlrfE80CYdSH47w.woff2) format('woff2');
  unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v10/gFXtEMCp1m_YzxsBpKl68iEAvth_LlrfE80CYdSH47w.woff2) format('woff2');
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v10/zhcz-_WihjSQC0oHJ9TCYPk_vArhqVIZ0nv9q090hN8.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
body {
      font: 400 15px Lato, sans-serif;
      line-height: 1.8;
      color: #818181;


  }
  h2 {
      font-size: 24px;
      text-transform: uppercase;
      color: #303030;
      font-weight: 600;
      margin-bottom: 30px;
  }
  h4 {
      font-size: 19px;
      line-height: 1.375em;
      color: #303030;
      font-weight: 400;
      margin-bottom: 30px;
  }  
  .jumbotron {
      background-color: #282828;
      color: #fff;
      padding: 100px 25px;
      font-family: Montserrat, sans-serif;
  }
  .container11 {
      padding: 80px 120px;
  }
  .person {
      width: 90%;
      height: 90%;
	  border-radius:0 !important;
      transition: box-shadow 0.5s;
	  
      
  }
  .person:hover {
      box-shadow: 5px 0px 40px rgba(0,0,0, .6);
  }

  
  .bg-grey {
      background-color: #f6f6f6;
  }
  .logo-small {
      color: #282828;
      font-size: 50px;
  }
  .logo {
      color: #282828;
      font-size: 200px;
  }
  .thumbnail {
      padding: 0 0 15px 0;
	  
      border: none;
      border-radius: 0;
  }
  .thumbnail img {

      margin-bottom: 10px;
  }
  .carousel-control.right, .carousel-control.left {
      background-image: none;
      color: #282828;
  }
  .carousel-indicators li {
      border-color: #282828;
  }
  .carousel-indicators li.active {
      background-color: #282828;
  }
  .item h4 {
      font-size: 19px;
      line-height: 1.375em;
      font-weight: 400;
      font-style: italic;
      margin: 70px 0;
  }
  .item span {
      font-style: normal;
  }
  .panel {
      border: 1px solid #282828; 
      border-radius:0 !important;
      transition: box-shadow 0.5s;
  }
  .panel:hover {
      box-shadow: 5px 0px 40px rgba(0,0,0, .2);
  }
  .panel-footer .btn:hover {
      border: 1px solid #282828;
      background-color: #fff !important;
      color: #282828;
  }
  .panel-heading {
      color: #fff !important;
      background-color: #282828 !important;
      padding: 25px;
      border-bottom: 1px solid transparent;
      border-top-left-radius: 0px;
      border-top-right-radius: 0px;
      border-bottom-left-radius: 0px;
      border-bottom-right-radius: 0px;
	  
  }
  .panel-footer {
      background-color: white !important;
  }
  .panel-footer h3 {
      font-size: 32px;
  }
  .panel-footer h4 {
      color: #aaa;
      font-size: 14px;
  }
  .panel-footer .btn {
      margin: 15px 0;
      background-color: #282828;
      color: #fff;
  }
  .navbar {
	  margin-bottom: 0;
      background-color: #282828;
      z-index: 9999;
      border: 0;
      font-size: 12px !important;
      line-height: 1.42857143 !important;
      letter-spacing: 4px;
      border-radius: 0;
      font-family: Montserrat, sans-serif;
	  
  }
  .navbar li a, .navbar .navbar-brand {
      color: #fff !important;
  }
  .navbar-nav li a:hover, .navbar-nav li.active a {
      color: #282828 !important;
      background-color: #fff !important;
  }
  .navbar-default .navbar-toggle {
      border-color: transparent;
      color: #fff !important;
  }
  footer .glyphicon {
      font-size: 20px;
      margin-bottom: 20px;
      color: #282828;
  }
/* Slide Animation */  
/* Hiệu ứng trượt */
.slideanim { visibility:hidden; }

.slide {
    animation-name: slide;
    -webkit-animation-name: slide;
    animation-duration: 1s;
    -webkit-animation-duration: 1s;
    visibility: visible;
}

@keyframes slide {
    0% {
        opacity: 0;
        transform: translateY(70%);
    } 
    100% {
        opacity: 1;
        transform: translateY(0%);
    }
}

@-webkit-keyframes slide {
    0% {
        opacity: 0;
        -webkit-transform: translateY(70%);
    } 
    100% {
        opacity: 1;
        -webkit-transform: translateY(0%);
    }
}

.paddder {padding-top: 50px;}
.whitespace {
	opacity: 0.1;
}
 @media screen and (max-width: 768px) {
    .col-sm-4 {
      text-align: center;
      margin: 25px 0;
    }

    .btn-lg {
        width: 100%;
        margin-bottom: 35px;
    }
  }
  @media screen and (max-width: 480px) {
    .logo {
        font-size: 150px;
    }
  }
@media only screen and (max-width: 768px){
	.anvideo{width: 360px;height: 203px;}
	.facevideo iframe {width: 90%!important}

}
@media only screen and (max-width: 414px){
	.facevideo iframe {width: 90%!important;height: 350px!important}
	

}
@media only screen and (max-width: 375px){
	
	

}


@media only screen and (max-width: 320px){
	.anvideo{width: 200px;height: 133px;}
	.navbar-brand {width: 80%;height: 50%}
}


a:link 			{color: black; background-color: transparent; text-decoration: none;}
a:visited 		{color: black; background-color: transparent; text-decoration: none;}


// Tự thêm vào các chức năng mới


/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local('Lato Regular'), local('Lato-Regular'), url(font/Lato-Regular-1.woff2) format('woff2');
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local('Lato Regular'), local('Lato-Regular'), url(font/Lato-Regular-2.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}



/* Style the tab */
div.tab {width: 100%;margin: auto;
    overflow: hidden;
    
    
}

/* Style the buttons inside the tab */
div.tab button {
    background-color: inherit;
    
    border: none;
    outline: none;
    cursor: pointer;
    padding: 10px 10px;
    transition: 0.3s;
    font-size: 17px;

}

/* Change background color of buttons on hover */
div.tab button:hover {
    background-color: #ddd;
}

/* Create an active/current tablink class */
div.tab button.active {
    background-color: #ccc;
}

/* Style the tab content */
.tabcontent {
    display: none;
    padding: 6px 12px;
    
    border-top: none;
}

.banggiachup {
	border: 1px solid #282828; 
	
}



.list-group .list-group-item {
    position: relative;
    padding-left: 50px;
    padding-right: 0;
    margin-bottom: 10px;
    background: none;
    border-color: transparent;
}

.paddingico  {
	padding-right: 20px;
}

.giachup {
	color: black;
}