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

/*************** ADD CUSTOM CSS HERE.   ***************/
.colleft,.colright{border:1px solid #ebebeb}
h3{font-size:17px}
h4{font-size:14px}
h3.catetit{background:#00895E;color:#fff;text-transform:uppercase;padding:12px 0;text-align:center;margin:0;font-size: 13px;font-weight:700}
ul.menul{list-style:none;margin:0;padding:0}
ul.menul li{border-bottom:1px solid #ebebeb;padding-top:8px;padding-bottom:8px}
.colleft h3.catetit::after,.colright h3.catetit::after,.breadcrumb::after{content:'';width:0;height:0;border-bottom:21px solid transparent;border-top:21px solid transparent;float:right;margin-top:-12px}
.colleft h3.catetit::before,.colright h3.catetit::before,.breadcrumb::before{content:'';width:0;height:0;border-bottom:21px solid transparent;border-top:21px solid transparent;float:left;margin-top:-12px}
.breadcrumb::before,.breadcrumb::after{margin-top:-11px}
.support{background:#f7f7f7;padding-top:15px}
.item-item{padding-left:5px;padding-right:5px}


.tc-wrapper {
    background-color: #baddb6;
    border: 2px dashed #44862d;
    border-radius: 15px;
    padding: 20px;
    max-width: 1200px;
    margin: 0 auto;
    box-sizing: border-box;
    font-family: Arial, sans-serif;
}
.tc-head {
    text-align: center;
    margin-bottom: 20px;
}
.tc-head h3 {
    color: #333;
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 10px 0 !important;
    text-transform: uppercase;
}
.tc-head p {
    color: #333;
    font-size: 15px;
    font-weight: 700;
    margin: 0 !important;
    text-transform: uppercase;
}
.tc-head a {
    color: #0044cc !important;
    text-decoration: none;
    font-weight: 800;
}
.tc-body {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr; 
    gap: 10px;
    align-items: center;
}
.tc-body br { display: none !important; }
.tc-body p { margin: 0 !important; padding: 0 !important; display: contents; }
.tc-field, .tc-body select {
    width: 100% !important;
    height: 42px !important;
    border: 1px solid #fff !important;
    border-radius: 4px !important;
    padding: 0 10px !important;
    font-size: 14px !important;
    color: #555;
    background: #fff !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}

.tc-btn {
    width: 100% !important;
    height: 42px !important;
    background: #5cad2c !important;
    background: linear-gradient(to bottom, #6ac134 0%, #5cad2c 100%) !important;
    color: #fff !important;
    font-weight: bold !important;
    text-transform: uppercase;
    border: none !important;
    border-radius: 4px !important;
    cursor: pointer;
    font-size: 13px !important;
    padding: 0 !important;
    margin: 0 !important;
    line-height: 1 !important;
}
.tc-btn:hover {
    background: #4a8f23 !important;
}
.tc-btn {
    transform: translateY(0px) !important; 
}
.tc-body {
    align-items: flex-start !important;
}

.tc-field, .tc-body select {
    margin-top: 0 !important; 
}


.footer-title h3{
	position: relative;
    padding-bottom: 7px;
    display: block;
    text-transform: uppercase;
    font-size: 1.2rem;
    color: #fff;
}
.footer-title h3:before {
    content: "";
    border-bottom: 1px solid #ffffff;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}
.footer-title h3:after {
    content: "";
    border-bottom: 3px solid #ffffff;
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    width: 30%;
}
@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
    .tc-body {
        grid-template-columns: 1fr; 
        gap: 10px;
    }
    
    .tc-head h3 {
        font-size: 16px;
    }
    .tc-head p {
        font-size: 13px;
    }
    .tc-btn {
        width: 100% !important;
    }
@media only screen and (max-width: 768px) {
    .tc-wrapper {
        border: 2px dashed #44862d !important;
        background-color: #baddb6 !important;
        padding: 15px !important;
        margin: 0 10px !important; 
        border-radius: 10px !important;
    }
    .tc-head h3 {
        color: #111 !important; 
        text-shadow: none !important;
        font-size: 15px !important;
        line-height: 1.4 !important;
        margin-bottom: 5px !important;
    }
    .tc-head p {
        color: #333 !important;
        font-size: 13px !important;
        margin-bottom: 10px !important;
    }
    .tc-btn {
        width: 100% !important;
        display: block !important;
        margin-top: 10px !important;
        transform: none !important; 
    }
    .tc-body {
        display: block !important; 
    }
    
    .tc-col {
        margin-bottom: 10px !important; 
    }
}
}