/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/
img { border-radius: 5px; }
.boxvnpost:hover { font-size: 120%; color: #002d74; }
.header-button-1 .header-button a:before { font-family: "Font Awesome 6 Free"; font-weight: 900; content: "\f095"; margin-right: 5px; }
.header-button-2 .header-button a:before { font-family: "Font Awesome 6 Free"; font-weight: 900; content: "\f002"; margin-right: 5px; }
@media screen and (max-width: 849px) {
  .medium-logo-center .flex-left { flex: inherit !important; }
  #logo img { max-height: 70px; }
}
@media screen and (max-width: 768px) {
  .header-button-2 .header-button a span { display: inline-block; max-width: 75px; overflow: hidden; white-space: nowrap; text-overflow: clip; vertical-align: middle; }
}
.secvaybang .icon-box-center .icon-box-img { margin: 0 auto 3px; }
@media screen and (min-width: 850px) {
  .css-coticon { max-width: 14.2857142857%; -ms-flex-preferred-size: 14.2857142857%; flex-basis: 14.2857142857%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; -webkit-transition: all .3s; -o-transition: .3s all; display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; flex-direction: column; align-items: center; transition: all .3s; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; border-left: 1px solid #e5e5e5; background: #f8f8f8; padding: 15px 5px; }
}
.off-canvas .nav-vertical > li > a { padding-bottom: 15px; padding-top: 15px; color: #002d73; }
.secvaybang p { margin-bottom: 0px; }
@media screen and (max-width: 849px) {
  .col { padding-bottom: 10px; }
}
.title-dark:after { content: ""; display: block; height: 5px; background-image: url(/wp-content/uploads/2025/07/line-dark.png); background-repeat: no-repeat; background-position: center bottom; }
.title-light:after { content: ""; display: block; height: 5px; background-image: url(/wp-content/uploads/2025/07/line-light.png); background-repeat: no-repeat; background-position: center bottom; }
.boxvnpost { padding: 18px 18px; margin: 10px 0; background-color: #f5f5f5; border-radius: 12px; font-size: 18px; border-left: 5px solid transparent; width: 360px; min-width: 300px; box-shadow: 0 0 0 1px #eee; color: #000; }
@media only screen and (min-width: 48em) {
  .boxvnpost { margin-left: 0px !important; }
}
.green { border-left-color: green; }
.orange { border-left-color: orange; }
.black { border-left-color: black; }
.red { border-left-color: red; }
.blue { border-left-color: blue; }
.detail-box { position: relative; background-color: #f9f9f9; border-radius: 20px; padding: 40px 20px 20px 20px; margin-bottom: 20px; max-width: 600px; box-shadow: 0 0 0 1px #eee; text-align: left; }
.detail-title { position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%); background-color: green; color: white; font-weight: bold; padding: 10px 24px; border-radius: 12px; font-size: 18px; white-space: nowrap; z-index: 1; }
.detail-box[data-color="green"] .detail-title { background-color: green; }
.detail-box[data-color="orange"] .detail-title { background-color: orange; }
.detail-box[data-color="black"] .detail-title { background-color: black; }
.detail-box[data-color="red"] .detail-title { background-color: red; }
.detail-box[data-color="blue"] .detail-title { background-color: blue; }
.detail-list { margin: 0; padding-left: 20px; font-size: 16px; }
.detail-list li { margin-bottom: 10px; }
.form-flat.sago-form { background-color: #ffffff; border-radius: 10px; padding: 20px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); }
@media only screen and (max-width: 48em) {
  /*************** ADD MOBILE ONLY CSS HERE  ***************/
  .detail-box { margin-top: 15px; }
  .secvaybang p { color: #fff !important; }
  #section_953148465 { padding-bottom: 20px; }
}