/* CSS for giaidieu theme - made by giaidieu.com */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
@import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,400,500,700&subset=latin,vietnamese');

:root {
  --primary_color: #008CEE;
  --gap-small: 15px;
  --gap-big: 30px;
}

html {
  font-size: 62.5%;
}

body {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1.3rem; /* 14px */
  background-color: #f3f3f3;
  color: #494949;
  padding: 0;
  margin: 0;
}

a:focus, a:active {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

a, a:visited {
  color: #000;
}

a:hover {
  color: #00a650;
  transition: 0.3s;
}

a.btn, a.button, .pager li > a.button {
  font-family: 'Open Sans Condensed', sans-serif;
  border-radius: 5px;
}

a.btn:hover, a.button:hover, .pager li > a.button:hover, button.btn-default:hover {
  opacity:  0.7;
}

a.btn.btn--primary, a.button, .pager li > a.button, button.btn-default {
  background-color: var(--primary_color);
  color: #fff;
}

h1 {
  font-size: 2.6rem;
}

h2 {
  font-size: 2.0rem;
}

h1, h2 {
  padding-bottom: var(--gap-small);
  margin-bottom: var(--gap-small);
  border-bottom: 1px #ccc solid;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--primary_color);  
}

#header.header-fixed {
  position: fixed;
  z-index: 9999;
  width: 100%;
}

div.field--name-body h2 {
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 0;
  font-weight: inherit;
  color: inherit;
  border-bottom: none;
  text-transform: none;
}

#header ul.menu--main a.is-active {
  background-color: #fff;
  color: var(--primary_color);
}

div.region-content div.field--name-body img {
  margin-top: var(--gap-small);
}

h3 {
  font-size: 1.6rem;
}

h4 {
  font-size: 1.4rem;
}

h1, h2, h3, h4 {
  font-family: 'Open Sans Condensed', sans-serif;
}

div[role="dialog"] div.ui-dialog-titlebar {
  background-color: #333;
  color: #fff;
}

div.ui-dialog .ui-dialog-titlebar-close, div.clearfix:before {
  display: none;
}

div.column-grid-3-7 {
  display: grid;
  grid-template-columns: 250px auto;
  grid-column-gap: var(--gap-big);
}

#block-giaidieu-hinhanhbando img {
  max-width: 100%;
  height: auto;
}

#header div.container-full-width {
  height: 60px;
  background-color: var(--primary_color);
  display: flex;
  justify-content: center;
  align-items: center;
}

#header ul.menu--main a {
  font-family: "Open Sans", sans-serif;
  font-size: 1.6rem;
  text-transform: uppercase;
  color: #fff;
  font-weight: 700;
  padding-left: 20px;
  padding-right: 20px;
}

#header ul.menu--main a:hover {
  color: var(--primary_color);
}

body.custom-home div.product-listing div.view-content, div.product-listing div.view-content > div.views-infinite-scroll-content-wrapper, body.entity-node-canonical div.product-listing div.view-content {
  display: grid;
  grid-template-columns: 255px 255px 255px;
  grid-gap: var(--gap-small);
}

body.custom-home div.project-listing div.view-content, div.project-listing div.view-content > div.views-infinite-scroll-content-wrapper, body.custom-home div.news-listing div.view-content, div.news-listing div.view-content > div.views-infinite-scroll-content-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: var(--gap-small);  
}

div.project-listing div.views-field-field-images {
  height: 588px;
  overflow: hidden;
  border: 1px solid #f0f0f0;
}

div.project-listing div.views-field-field-images img {
  width: 100%;
  object-fit: cover;
}

div.node-article-teaser {
  display: grid;
  grid-template-columns: 100px auto;
  grid-gap: var(--gap-small);
}

div.region-left, div.region-content {
  background-color: #fff;
  padding: 30px;
  box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.1);
}

div.view-filters {
  margin-bottom: var(--gap-big);
}

#block-giaidieu-views-block-node-functions-block-slideshow div.view-content img {
  width: 100%;
  height: auto;
  max-width: 100%;
}

#block-giaidieu-views-block-node-functions-block-slideshow, #block-giaidieu-bannerchinh, div.region-content div.views-element-container {
  margin-bottom: var(--gap-big);
}

#block-giaidieu-hinhanhbando {
  margin-top: var(--gap-big);
}

#block-giaidieu-danhmucsanpham h4 {
  text-transform: uppercase;
  font-weight: 600;
}

#block-giaidieu-hotrotructuyen p {
  font-family: "Open Sans", sans-serif;
  font-weight: bold;
}

#block-giaidieu-chinhsachbanhang li a {
  padding: 5px;
  padding-left: 20px;
  line-height: 120%;
}

#block-giaidieu-chinhsachbanhang li a:before {
  font-family: "Font Awesome 5 Free";
  font-weight: 400;
  content: "\f15b";
  display: inline-block;
  position: absolute;
  left: 5px;
  top: 7px;
}

div.node-san-pham-teaser div.teaser-wrapper, div.project-listing div.views-field-title {
  margin-top: 5px;
}

div.node-san-pham-teaser div.field--name-field-danh-muc-san-pham {
  font-family: 'Open Sans Condensed', sans-serif;
  font-size: 1.4rem;
  font-weight: 600;
}

div.node-san-pham-teaser div.field--type-image {
  height: 143px;
  overflow: hidden;
}

div.project-listing div.views-field-title a, div.news-listing p.node-title a {
  font-weight: bold;
}

body.view-node-functions-page-projects div.project-listing div.views-field-title {
  margin-top: 10px;
}

#footer {
  margin-top: var(--gap-big);
  padding: var(--gap-big);
}

#footer ul.menu--footer.nav {
  background-color: var(--primary_color);
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.1);
}

#footer ul.menu--footer.nav > li {
  display: inline-block;
}

#footer ul.menu--footer.nav > li a {
  font-family: "Open Sans", sans-serif;
  text-transform: uppercase;
  color: #fff;
}

#footer ul.menu--footer.nav > li a:hover {
  color: var(--primary_color);
}

#footer div.region-footer {
  display: grid;
  grid-template-columns: 45% auto;
  grid-gap: var(--gap-small);
  align-items: start;
  justify-items: start;
}

#block-giaidieu-rightfooter {
  padding-left: 200px;
}

#block-giaidieu-thongketruycap h2 {
  margin-top: 0;
}

#block-giaidieu-thongketruycap p {
  margin-top: var(--gap-big);
}

#block-giaidieu-diachivanphong p {
  margin: 0 0 5px;
}

#block-giaidieu-views-block-node-functions-block-home-thong-so-den-led div.views-field-title {
  margin-bottom: 10px;
}

#block-giaidieu-views-block-node-functions-block-home-thong-so-den-led div.views-field-title a {
  margin-left: 5px;
}

div.region-content div.views-element-container, #custom-relative-news {
  position: relative;
}

body.custom-home div.region-content div.views-element-container div.view-header, div.link-view-all {
  position: absolute;
  right: 0;
  top: -5px;
}

div.link-view-all {
  position: absolute;
  right: 0;
  top: -2px;  
}

div.node-article-medium p.node-title {
  font-size: 1.6rem;
  font-weight: bold;
  margin-bottom: 10px;
}

div.node-article-medium div.teaser-wrapper {
  display: grid;
  grid-template-columns: 300px auto;
  grid-gap: var(--gap-small);
  align-items: start;
  justify-items: start;  
}

div.node-article-medium {
  padding-bottom: var(--gap-small);
  margin-bottom: var(--gap-small);
  border-bottom: 1px solid #f0f0f0;
}

div.node-san-pham-full div.field--name-field-danh-muc-san-pham {
  text-transform: uppercase;
  margin-bottom: var(--gap-small);
}

div.field--name-body img {
  max-width: 100%;
  height: auto;
}

#custom-relative-news {
  margin-top: calc(var(--gap-big) * 2);
}

p.node-link {
  margin-top: var(--gap-small);
}

div.node-article-medium div.teaser-wrapper {
  height: 200px;
  overflow: hidden;
}

#mobile-menu-toggle {
  position: absolute;
  top: -10px;
  font-size: 3.0rem;
  z-index: 10;
  display: none;
  color: #008837;
}