﻿@charset "UTF-8";
@import url("/assets/fonts/roboto/font-roboto.css");
@import url("/assets/fonts/roboto/font-roboto.css");
@media only screen and (min-width: 1200px) {
  .container {
    min-width: 80%; } }

/******* RESPONSIVE ********/
/****Màn hình máy tính thông thường****/
/****Màn hình ipad hiển thị theo chiều ngang (Landscape)****/
/****Màn hình desktop loại bé****/
/****Màn hình ipad loại bé hiển thị theo chiều ngang (Landscape)****/
/****Màn hình ipad hiển thị theo chiều dọc (Portrait)****/
/****Màn hình ipad loại bé hiển thị theo chiều dọc (Portrait)****/
/****Màn hình điện thoại hiển thị theo chiều ngang (Landscape)****/
/****Màn hình điện thoại Iphone Plus****/
/****Màn hình điện thoại Iphone****/
/****Màn hình điện thoại loại bé****/
/*@mixin mobile {
    @media(max-width: 767px) {
        @content
    }
}


@mixin ipad {
    @media(min-width: 768px) and (max-width:1024px) {
        @content
    }
}
@mixin tablet {
    @media only screen and (max-width: 1200px) {
        @content
    }
}

@mixin ipad {
    @media only screen and (max-width:1024px) {
        @content
    }
}

@mixin ipad-port {
    @media only screen and (max-width:992px) {
        @content
    }
}

@mixin mobile {
    @media only screen and (max-width:769px) {
        @content
    }
}

@mixin ipadSmPort {
    @media only screen and (max-width:600px) {
        @content
    }
}

@mixin mobile-small {
    @media only screen and (max-width: 577px) {
        @content
    }
}

@mixin iphonePlus {
    @media only screen and (max-width: 415px) {
        @content
    }
}

@mixin iphone {
    @media only screen and (max-width: 376px) {
        @content
    }
}

@mixin mobileSm {
    @media only screen and (max-width: 376px) {
        @content
    }
}

@mixin onlyTablet {
    @media (min-width: 1025px) and (max-width: 1200px) {
        @content
    }
}

@mixin onlyIpad {
    @media (min-width: 992px) and (max-width:1024px) {
        @content
    }
}

@mixin onlyIpad-port {
    @media (min-width: 769px) and (max-width:992px) {
        @content
    }
}

@mixin onlyMobile {
    @media (min-width: 577px) and (max-width:769px) {
        @content
    }
}

@mixin onlyMobile-small {
    @media (max-width: 577px) {
        @content
    }
}
@mixin mobile {
    @media (max-width: 600px) {
        @content;
    }
}



@mixin desktop {
    @media (min-width:768px) and (max-width: 1024px) {
        @content;
    }
}

@mixin desktop-up {
    @media (min-width: 1800px) {
        @content;
    }
}*/
#p-VB {
  min-height: calc(100vh - 210px);
  padding-top: 30px; }
  #p-VB .title-general {
    font-size: 1.3rem;
    padding: 10px 0 10px 10px;
    margin-bottom: 0;
    color: #fff;
    background: #ecf1f5;
    position: relative; }
    #p-VB .title-general:after {
      content: '';
      position: absolute;
      display: block;
      right: 0;
      bottom: 0;
      width: 0;
      height: 0;
      border-top: 24px solid transparent;
      border-right: 12px solid #ecf0f1;
      border-bottom: 24px solid transparent; }
    #p-VB .title-general i {
      margin-right: 5px;
      font-size: 18px; }
  #p-VB a.btn {
    background-color: #fff;
    border-color: #ccc;
    color: #111111 !important; }
  #p-VB a:hover {
    cursor: pointer; }
  #p-VB .category-list {
    background-color: #fff; }
    #p-VB .category-list li {
      padding: 8px 0 8px 15px;
      border-bottom: 1px solid #dadada;
      border-left: 3px solid #fff; }
      #p-VB .category-list li a {
        color: #111111; }
        #p-VB .category-list li a i {
          margin-right: 5px; }
      #p-VB .category-list li.active, #p-VB .category-list li:hover {
        color: #035fda;
        cursor: pointer; }
      #p-VB .category-list li.active {
        font-weight: 600; }
      #p-VB .category-list li ul li a {
        color: #111111; }
      #p-VB .category-list li ul li:last-child {
        border-bottom: none; }
  #p-VB .content {
    margin-bottom: 30px; }
    #p-VB .content-heading {
      display: flex;
      align-items: center;
      background-color: rgba(0, 0, 0, 0.05);
      background-image: inherit;
      padding: 12px 22px;
      margin-bottom: 20px;
      border-radius: 2px; }
      #p-VB .content-heading .boxSearch {
        flex: 1;
        position: relative;
        width: fit-content;
        z-index: 0; }
        #p-VB .content-heading .boxSearch input {
          border-color: #ccc;
          border-right: none;
          font-size: 15px;
          padding-left: 10px; }
          #p-VB .content-heading .boxSearch input:focus {
            box-shadow: none; }
        #p-VB .content-heading .boxSearch span {
          font-size: 18px;
          border-color: #ccc;
          border-left: none;
          border-radius: 0 4px 4px 0;
          background-color: #fff; }
          #p-VB .content-heading .boxSearch span:hover {
            cursor: pointer; }
      #p-VB .content-heading .boxOption {
        flex: 1;
        text-align: right; }
        #p-VB .content-heading .boxOption .dropdown-menu a {
          font-size: 14px;
          padding: 6px 12px;
          display: flex;
          position: relative; }
          #p-VB .content-heading .boxOption .dropdown-menu a .icon i {
            margin-right: 4px;
            font-size: 12px; }
            #p-VB .content-heading .boxOption .dropdown-menu a .icon i:last-child {
              border-right: none; }
            #p-VB .content-heading .boxOption .dropdown-menu a .icon i:hover, #p-VB .content-heading .boxOption .dropdown-menu a .icon i.active {
              color: #035fda; }
            #p-VB .content-heading .boxOption .dropdown-menu a .icon i:first-child {
              transform: rotate(180deg); }
          #p-VB .content-heading .boxOption .dropdown-menu a span:hover {
            color: #035fda; }
          #p-VB .content-heading .boxOption .dropdown-menu a:after {
            content: '';
            position: absolute;
            display: block;
            left: 5px;
            bottom: 0;
            width: 94%;
            height: 1px;
            background-color: #726868; }
          #p-VB .content-heading .boxOption .dropdown-menu a:last-child:after {
            content: none; }
    #p-VB .content-main ul.listItem li .box {
      margin-bottom: 15px; }
      #p-VB .content-main ul.listItem li .box h6.title {
        background-color: #fff;
        padding: 10px 20px;
        margin-bottom: 0;
        position: relative; }
        #p-VB .content-main ul.listItem li .box h6.title i {
          background-color: #fff;
          border-radius: 50%;
          margin-right: 5px; }
        #p-VB .content-main ul.listItem li .box h6.title:after {
          content: '';
          position: absolute;
          display: block;
          left: 10px;
          bottom: 0;
          background-color: #ccc;
          width: 98%;
          height: 1px; }
      #p-VB .content-main ul.listItem li .box .item {
        display: flex;
        background-color: #fff;
        padding: 10px 20px; }
        #p-VB .content-main ul.listItem li .box .item .left {
          flex: 2.5;
          padding-right: 20px; }
          #p-VB .content-main ul.listItem li .box .item .left p.desc {
            text-align: justify;
            min-height: 40px;
            margin-bottom: 8px; }
          #p-VB .content-main ul.listItem li .box .item .left ul.func {
            display: flex;
            margin-bottom: 6px; }
            #p-VB .content-main ul.listItem li .box .item .left ul.func li {
              margin-right: 5px; }
              #p-VB .content-main ul.listItem li .box .item .left ul.func li a {
                color: #111111;
                padding: 5px 6px;
                background-color: #fff;
                filter: drop-shadow(1px 1px 5px rgba(0, 0, 0, 0.15));
                transition: all 0.2s ease-in; }
                #p-VB .content-main ul.listItem li .box .item .left ul.func li a i {
                  margin-right: 5px; }
                #p-VB .content-main ul.listItem li .box .item .left ul.func li a:hover {
                  color: #fff;
                  transition: all 0.2s ease-out; }
        #p-VB .content-main ul.listItem li .box .item .right {
          flex: 1; }
          #p-VB .content-main ul.listItem li .box .item .right p {
            text-align: right; }
            #p-VB .content-main ul.listItem li .box .item .right p span {
              float: left;
              margin-right: 5px; }
