/*
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.   ***************/
ul.header-nav.header-nav-main {
    display: flex;
   gap: 14px;
}

.section-footer span.ux-menu-link__text {
    color: #000;
}

.section-footer span.ux-menu-link__text:hover {
    color: #bbeced;
}


.section-footer a.ux-menu-link__link.flex {
    margin-bottom: -4px;
}

.absolute-footer.dark {
    display: none;
}

.img-radius img {
    border-radius: 16px;
}

.section-footer .social-icons {
    display: flex;
    justify-content: center;
    gap: 14px;
}


h6.uppercase.portfolio-box-title {
    color: #000;
    font-size: 17px;
    margin-bottom: 8px;
}

.portfolio-box-excerpt {
    color: #000;
    font-size: 14px;
}

.portfolio-element-wrapper .col-inner:hover h6.uppercase.portfolio-box-title {
/*     background: linear-gradient(135deg, #0a4fdc, #1e6be8, #3bb2ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent; */
	 color: #0F8188;
}


.portfolio-page-wrapper .page-title-inner {
    min-height: 300px;
    padding-top: 20px;
    position: relative;
}

.portfolio-page-wrapper .title-bg.fill.bg-fill {
    height: 300px;
}

.portfolio-page-wrapper h1.entry-title {
    font-size: 38px;
}


.col-grad .col-inner {
    border-radius: 22px;
/*     background: linear-gradient(to bottom,
            #BBECED 0%,
            #377E80 50%,
            #74DDD0 100%); */
/* 	    background: linear-gradient(to bottom, #0B46DE 0%, #1865E5 50%, #2172E7 100%); */
	background: linear-gradient(to bottom, #377E80 0%, #0F8188 50%, #1eafb8 100%);
    overflow: hidden;
    padding: 0px 0px 20px 0px;
}

.col-grad .box-text.text-center {
    border-radius: 22px;
}


.text-ok h3.uppercase {
    min-height: 60px;
}

.col-grad-banner {
    height: 400px;
       background: linear-gradient(180deg, #0F8188 0%, #ffffff 100%);
    border-radius: 50px;
    overflow: hidden;
}

.col-vision .col-inner {
    min-height: 384px;
}


.col-value .col-inner {
    min-height: 162px;
}


.custom-form {
    max-width: 500px;
    margin: 0 auto;
}



.custom-form input:focus,
.custom-form textarea:focus {
    border-color: #4fcfc1;
    box-shadow: 0 0 5px rgba(116, 221, 208, 0.5);
}

.custom-form textarea {
    min-height: 120px;
    resize: vertical;
}

.custom-form input[type="submit"] {
/*  background: linear-gradient(135deg, #0B46DE 0%, #1865E5 50%, #2172E7 100%); */
	    background: #0F8188;
    color: #fff;
    border: none;
    cursor: pointer;
    font-weight: 600;
    display: block;
    margin: 10px auto 0;
    padding: 2px 30px;
    border-radius: 30px;
    transition: 0.3s ease;
}

.custom-form input[type="submit"]:hover {
    background-color: #4fcfc1;
}

.img-nghieng {
    position: relative;
    transform: rotate(7deg);
}

.img-nghieng .img-inner {
    border-radius: 100px 20px;
    overflow: hidden;
}

.img-nghieng img {
    display: block;
    width: 100%;
}

.img-nghieng::before {
    content: "";
    position: absolute;
    inset: 0;
    background-color: rgba(1, 82, 139, 0.1);
    border-radius: 20px 100px;
    transform: rotate(-15deg);
    z-index: -1;
}

.text-back h3.uppercase {
      background: #0F8188;
    padding: 14px;
    width: max-content;
    border-radius: 10px;
    color: #fff;
    font-size: 18px;
}

.section-pre-footer-contact {
    border-top: 1px solid #ed323754;
}

iframe {
    margin-bottom: -29px;
}

.accordion .toggle {
    border-radius: 999px;
    height: 1.5em;
    left: auto !important;
    margin-right: 5px;
    position: absolute;
    top: .3em;
    transform-origin: 50% 47%;
    width: 2.3em;
    right: 0px;
}

a.accordion-title.plain {
    padding-left: 10px;
    color: #000;
}

a.accordion-title.plain {
    border-bottom: 1px solid #ddd;
    padding-left: 10px;
    color: #000;
    border-top: unset;
}

.accordion-title.active {
    color: #74ddd0 !important;
}

h5.post-title.is-large a {
    color: #000;
    font-size: 17px;
}


p.from_the_blog_excerpt {
    color: #777777;
    font-size: 14px;
}

.blog-news .col.post-item .col-inner {
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .15);
    border-radius: 12px;
}

.col.post-item .box-text.text-left {
    padding: 20px;
}

.blog-news .col.post-item .post-meta {
    border-top: 1px solid;
    padding-top: 15px;
    margin-top: 15px;
}

.col.post-item .box-image {
    border-radius: 12px 12px 0px 0px;
}

aside.widget.widget_categories {
    background: #F5F5F5;
    border-radius: 12px;
    padding: 22px;
}

.widget .is-divider {
    display: none;
}

span.widget-title {
    color: #000;
    font-size: 18px;
}

.post-sidebar .col.post-item {
    margin-bottom: -55px;
}

.col-sv .portfolio-element-wrapper .row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

/* mỗi item */
.col-sv .portfolio-element-wrapper .row > .col {
    flex: 0 0 33.333%;
    max-width: 33.333%;
}

/* content căn giữa */
.col-sv .portfolio-element-wrapper .box-text-inner {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.sv-social-icons{
    display:flex;
    justify-content:center;
    gap:10px;
    flex-wrap:wrap;
}

.sv-icon{
       width: 45px;
    height: 45px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#5b9e3f;
    color:#fff;
    font-size:18px;
    text-decoration:none;
    transition:0.3s;
}

.sv-icon:hover{
    transform:scale(1.1);
}

/* màu riêng từng icon */
.sv-icon.facebook{ background:#1877f2; }
.sv-icon.instagram{ background:#e1306c; }
.sv-icon.linkedin{ background:#0077b5; }
.sv-icon.email{ background:#555; }
.sv-icon.zalo{
background:#0068ff;
}

.sv-icon:hover{
transform:translateY(-3px) scale(1.1);
box-shadow:0 6px 12px rgba(0,0,0,0.15);
}

/* màu hover từng icon */
.sv-icon.facebook:hover{background:#1877f2;color:#fff;}
.sv-icon.instagram:hover{background:#e4405f;color:#fff;}
.sv-icon.linkedin:hover{background:#0a66c2;color:#fff;}
.sv-icon.email:hover{background:#ea4335;color:#fff;}
.sv-icon.zalo:hover{background:#0068ff;}
.sv-icon.map:hover{background:#34a853;color:#fff;}
.sv-icon.to-top:hover{background:#000;color:#fff;}
.sv-icon.contact:hover{background:#ff6a00;color:#fff;}

.sv-icon.zalo svg{
width:20px;
height:20px;
}
.sv-icon.map{ background:#ea4335; }
.sv-icon.to-top{ background:#333; }
.sv-icon.contact{ background:#5b9e3f; }

/* .section-footer {
    background: linear-gradient(135deg, #0B46DE 0%, #1865E5 50%, #2172E7 100%);
} */

/* .header:not(.transparent) .header-nav-main.nav > li > a:hover, .header:not(.transparent) .header-nav-main.nav > li.active > a, .header:not(.transparent) .header-nav-main.nav > li.current > a, .header:not(.transparent) .header-nav-main.nav > li > a.active, .header:not(.transparent) .header-nav-main.nav > li > a.current {
    background: linear-gradient(135deg, #0a4fdc, #1e6be8, #3bb2ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}
 */
.text-grad, h5.post-title.is-large a:hover{
	 background: linear-gradient(135deg, #0a4fdc, #1e6be8, #3bb2ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}
.text-grad h3.uppercase {
    min-height: 62px;
}

.img-logo-footer img {
    filter: brightness(0) invert(1);
}

.section-footer {
    border-top: 1px solid #0F8188;
}
@media only screen and (max-width: 48em) {
    /*************** ADD MOBILE ONLY CSS HERE  ***************/


}