/*
Theme Name: Thiết kế web 
Theme URI: http://underscores.me/
Author: Thanh Doan
Author URI: https://www.facebook.com/thanh250896
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: tkw
Tags:

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Thiết kế web Hoàng Long media is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.io/normalize.css/
*/
.pum-content.popmake-content:focus-visible, 
.pum-content *:focus, 
.pum-overlay .pum-content {
    outline: none !important;
}
.wpcf7 br {
    display: none;
}
@media (min-width: 1200px) {
    .container {
        max-width: 1200px;
    }
}
body {
	 font-family: "Montserrat", sans-serif;
    font-size: 15px;
    line-height: 1.5;
    color: #111;
    font-weight: 500;
}
figure {
    max-width: 100%;
}
a {
	text-decoration: none;
	color: inherit;
	transition: all .3s;
}
a:hover {
    color: #45b87c;
	text-decoration: none;
}
button,input {
	outline: none !important;
	box-shadow: none !important;
}
.btn-primary.active, .btn-primary:active, .open>.dropdown-toggle.btn-primary,.btn-primary:focus {
	background-color: unset;
	border-color: unset;
	border: 0 !important;
}
a:focus {
  outline: 0 !important;
}
@media screen and (max-width: 782px){
	html {
	    margin-top: 0 !important;
	}
}
h2.screen-reader-text {
    display: none;
}
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}
.showbar .icon-bar {
    display: block;
    width: 33px;
    height: 3px;
    border-radius: 1px;
}
.showbar .icon-bar {
    background-color: #45b87c;
}
.showbar .icon-bar+.icon-bar {
    margin-top: 7px;
}
.overbg-mobile {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #111;
    opacity: .5;
    z-index: 9999;
    display: none;
}
.close-menu {
    background: #fff;
    color: #0003AB;
    text-align: center;
    padding: 10px;
    font-size: 18px;
}
#mobile-menu .sub-menu img {
    display: none;
}
.stick-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    animation-name: effect;
    animation-duration: .3s;
    background: #fff;
    box-shadow: 2px 2px 2px #1113;
}
@keyframes effect {
  from {top: -50px}
  to {top: 0}
}
.alert-warning {
    background: transparent;
    border: 0;
    font-size: 16px;
    font-weight: 700;
    text-align: center;
    color: #111;
}
.tab-content > .tab-pane:not(.active), 
.pill-content > .pill-pane:not(.active) {
    display: block;
    height: 0;
    overflow-y: hidden;
}
.form-control:focus {
    box-shadow: unset !important;
    border-color: #ced4da;
}
.wpcf7-select, .wpcf7-text, .wpcf7-textarea,.wpcf7-number {
    display: block;
    width: 100%;
    height: calc(1.5em + 0.75rem + 2px);
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    outline: none !important;
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.wpcf7-textarea {
    height: auto;
}
.wpcf7-submit {
    display: inline-block;
    font-weight: 400;
    color: #212529;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 0.25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    color: #fff;
    background-color: #007bff;
    border-color: #007bff;
    cursor: pointer;
}
#logo img {
    width: 150px;
}
nav#primary-menu ul.menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
}

#primary-menu .menu > li.current-menu-item > a,#primary-menu .menu > li:hover > a {
    border-bottom: 2px solid #45b87c;
    color: #45b87c;
}

#primary-menu .menu > li {
    margin: 0 10px;
}
#primary-menu .menu > li.menu-item-has-children>a:after {
    content: "\f078";
        font-family: 'Font Awesome 5 Free';
    font-size: 12px;
    margin-left: 8px;
}
#primary-menu .sub-menu > li.menu-item-has-children>a:after {
    content: "\f105";
        font-family: 'Font Awesome 5 Free';
    font-size: 14px;
    position: absolute;
    right: 10px;
    top: 10px;
}
#primary-menu .sub-menu li a:hover {
    color: #45b87c;
}

nav#primary-menu {
    flex: 1;
    padding: 0 15px;
}
nav#primary-menu {
    flex: 1;
    padding: 0 15px;
}
#header{
    box-shadow:0 8px 30px rgba(0,0,0,.05);
}
.hc-wrap {
    box-shadow: 0 10px 35px rgba(0,0,0,.08);
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    padding: 25px;
}

section.home-content {
    margin-top: -160px;
    position: relative;
    z-index: 99;
}

.hc-wrap .item {
    text-align: center;
    height: 100%;
    padding-bottom: 15px;
    position: relative;
}

.hc-wrap img {
    width: auto;
    height: 100px;
}

.hc-wrap h3 {
    font-size: 21px;
    margin: 15px 0 10px;
}

.hc-wrap p {
    margin: 0;
    font-size: 14px;
}

.hc-wrap .item:after {
    content: "";
    display: block;
    width: 50px;
    height: 3px;
    background: #45b87c;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}

section.home-content-2 {
    padding: 50px 0;
}

.hc2-right h3 {
    color: #45b87c;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 700;
    font-size: 21px;
}

.hc2-right h2 {
    font-size: 32px;
}

.hc2-right h2 b {
    color: #45b87c;
}

.hc2-right .item {
    padding: 10px;
    box-shadow: 0 10px 35px rgba(0, 0, 0, .08);
    text-align: center;
    height: 100%;
}


.hc2-right .item h3 {
    font-size: 21px;
    margin: 6px 0;
}

.hc2-right .item p {
    margin: 0;
    font-size: 14px;
}

.hc2-right .item img {
    width: auto;
    height: 80px;
}
.heading {
    text-align: center;
    margin-bottom: 40px;
}

.heading h2 {
    text-transform: uppercase;
    position: relative;
    font-size: 32px;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.heading h2:after {
    content: "";
    display: block;
    width: 100px;
    height: 2px;
    background: #45b87c;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}

.heading p {
    margin: 0;
}

section.home-content-3 .item {
    text-align: center;
}

section.home-content-3 img {
    width: auto;
    height: 130px;
}

section.home-content-3 h3 {
    font-size: 16px;
    margin: 15px 0;
    padding-bottom: 10px;
    position: relative;
}

section.home-content-3 p {
    margin: 0;
    font-size: 14px;
}

section.home-content-3 h3:after {
    content: "";
    display: block;
    width: 50px;
    height: 2px;
    background: #45b87c;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}
section.home-blog {
    padding-bottom: 50px;
}
.blog-item {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0,0,0,.08);
    transition: all .3s ease;
    height: 100%;
}

.blog-item:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 30px rgba(0,0,0,.15);
}

.blog-thumb {
    display: block;
    overflow: hidden;
    position: relative;
}

.blog-thumb img {
    width: 100%;
    height: 240px;
    object-fit: cover;
    transition: transform .5s ease;
    display: block;
}

.blog-item:hover .blog-thumb img {
    transform: scale(1.08);
}

.blog-content {
    padding: 20px;
}

.post-date {
    font-size: 14px;
    color: #888;
    margin-bottom: 10px;
}

.post-date i {
    color: #45b87c;
    margin-right: 6px;
}

.blog-title {
    font-size: 20px;
    line-height: 1.5;
    margin: 0;
    font-weight: 600;
}

.blog-title a {
    color: #222;
    text-decoration: none;
    transition: color .3s;
}

.blog-title a:hover {
    color: #45b87c;
}
footer#footer {
    padding: 50px 0;
    background: #45b87c;
    color: #fff;
    margin-top: 30px;
}

div#logo-footer {
    margin-bottom: 15px;
    display: inline-block;
}

div#logo-footer img {
    width: 165px;
}

.footer-social ul {
    list-style: none;
    margin: 0;
    display: flex;
    align-items: center;
}

.footer-social ul a {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #fff;
    border-radius: 100%;
    color: #fff;
}

.footer-social li:not(:last-child) {
    margin-right: 15px;
}

.footer-social ul a:hover {
    background: #0fabe9;
    border: 1px solid #0fabe9;
}

footer#footer .title {
    text-transform: uppercase;
    font-weight: 700;
    font-size: 18px;
    margin-bottom: 15px;
}

.footer-info ul {
    list-style: none;
    margin: 0;
}

.footer-info li:not(:last-child) {
    margin-bottom: 10px;
    font-size: 14px;
}

.footer-info i {
    margin-right: 5px;
    color: #fff;
}

.footer-block-menu a {
    display: block;
    margin-bottom: 15px;
    color: #fff;
}
.brc {
    padding: 10px 0;
    font-size: 14px;
    color: #333;
    font-weight: 500;
    margin-bottom: 15px;
}
/* Input */

.box-send-contact input:not([type=submit]),
.box-send-contact textarea,
.box-send-contact select{

    width:100%;
    height:56px;
    border:1px solid #ddd;
    border-radius:12px;
    background:#fafafa;
    padding:0 18px;
    font-size:15px;
    transition:.3s;
    margin-bottom:18px;
    box-shadow:none;
}

.box-send-contact textarea{

    height:160px;
    padding:15px 18px;
    resize:none;
}

/* Focus */

.box-send-contact input:focus,
.box-send-contact textarea:focus,
.box-send-contact select:focus{

    border-color:#45b87c;
    background:#fff;
    box-shadow:0 0 0 4px rgba(239,74,9,.12);
}

/* Placeholder */

.box-send-contact ::placeholder{

    color:#999;
}

/* Submit */

.box-send-contact input[type=submit]{

    width:100%;
    height:58px;
    background:#45b87c;
    color:#fff;
    border:none;
    border-radius:50px;
    font-size:17px;
    font-weight:700;
    cursor:pointer;
    transition:.35s;
    box-shadow:0 10px 25px rgba(239,74,9,.3);
}

.box-send-contact input[type=submit]:hover{

    background:#45b87c;
    transform:translateY(-2px);
    box-shadow:0 18px 35px rgba(239,74,9,.35);

}

/* Spinner */

.box-send-contact .wpcf7-spinner{
    margin-top:15px;
}

/* Validation */

.box-send-contact .wpcf7-not-valid{

    border-color:#ff3d3d;
}

.box-send-contact .wpcf7-not-valid-tip{

    font-size:13px;
    margin-top:5px;
}

.box-send-contact .wpcf7-response-output{

    margin-top:20px !important;
    border-radius:12px;
    padding:15px;
}
.contact-info h2{font-size: 38px;color: #45b87c;margin-bottom: 20px;line-height:1.4;text-transform: uppercase;}

.contact-desc{

    color:#666;
    margin-bottom:35px;
    line-height:1.8;

}

.contact-item{

    position:relative;
    padding-left:75px;
    margin-bottom:28px;
    min-height:56px;

}

.contact-item:last-child{

    margin-bottom:0;

}

.contact-item::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:56px;
    height:56px;
    background:#45b87c;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-family:"Font Awesome 5 Free";
    font-weight:900;
    font-size:22px;
    box-shadow:0 10px 25px rgba(239,74,9,.25);
}

/* Địa chỉ */

.contact-item.location::before{

    content:"\f3c5";

}

/* Hotline */

.contact-item.phone::before{

    content:"\f095";

}

/* Email */

.contact-item.email::before{

    content:"\f0e0";

}

.contact-item h4{

    margin:0 0 6px;
    font-size:18px;
    color:#222;

}

.contact-item p{

    margin:0;
    color:#666;
    line-height:1.8;

}
@media (max-width: 991px) {
    .blog-thumb img {
        height: 220px;
    }

    .blog-title {
        font-size: 18px;
    }
    div#logo {
    flex: 1;
}

header#header {
    padding: 10px 0;
}

#home-slide img {
    height: 300px;
}

section.home-content {
    margin: 30px 0 0;
}

.hc-wrap {
    padding: 0;
}

.hc-wrap img {
    height: 80px;
}

.hc-wrap h3 {
    font-size: 16px;
}

.hc-wrap p {
    font-size: 13px;
}

section.home-content-2 {
    padding: 30px 0;
}

.hc2-right h2 {
    font-size: 28px;
}

.heading h2 {
    font-size: 24px;
}

.heading {
    margin-bottom: 20px;
}

section.home-blog {
    padding-bottom: 30px;
}
.page-heading {
    font-size: 21px;
}
}

@media (max-width: 576px) {
    .blog-thumb img {
        height: 200px;
    }

    .blog-content {
        padding: 15px;
    }

    .blog-title {
        font-size: 17px;
    }
}
.singular-post-content table {
    margin-bottom: 15px;
}
@media (max-width: 1199px) {
  #primary-menu .menu > li > a {
    padding: 25px 8px;
    font-size: 13px;
  }
  #primary-menu .menu > li {
    margin: 0;
}
}