/*!
Theme Name: tech365
Theme URI: http://underscores.me/
Author: QuanPhan dot Com
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: tech365
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

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

tech365 is based on Underscores https://underscores.me/, (C) 2012-2020 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 https://necolas.github.io/normalize.css/
*/
::root {
	--primary-color:#109aff;
	--secondary-color:;
	--red-color:#dc2626;
	--green-color:#16a34a;
	--light-green-color:#5de38e1a;
	--dark-green-color:#4BC77A;
	--blue-color:#109aff;
	--light-blue-color:#109aff1a;
	--gray-color:#e5e7eb;
	--dark-gray-color:#d1d5db;
	--light-gray-color:#f9fafb;

}
.bg-red{
    background-color: #dc2626;
}
.bg-green{
    background-color: #16a34a;
}
.shadow-md {
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
}
.shadow-sm{
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
}
.menu-has-sub a{
	color:#374151;
	padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    display: block;
}
.menu-has-sub a:hover{
	background: #f9fafb;
}
#mobile-menu ul li a{
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    width:100%;
}
#mobile-menu ul li.menu-item-has-children a{
    width:95%;
}
#mobile-menu .sub-menu{
    padding-left: 0.75rem;
}
.bg-pri-gradient{
	background: linear-gradient(135deg, #109AFF 0%, rgba(16, 154, 255, 0.1) 100%);
}
#service-pricing .mt-auto a,.pricing-type2 a{
	width:100%;
	display: block;
	text-align: center;
}
.custom-box-pricing .text-center>*{
	color:white;
}

#service-pricing .custom-box-pricing .mt-auto a{
	background:white;
	color:#109aff;
}
#service-pricing ul li{
	margin-bottom: 16px;
}
#service-pricing ul li:last-child{
	margin-bottom: 0;
}
#service-pricing ul li:before,.fix-ul-list ul li:before{
	content: "\eb7b";
}
#service-pricing ul li:before,.box-event-content ul li:before,.prose ul li:before,.fix-ul-list ul li:before{
	margin-right:12px;
	font-family: remixicon !important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color:#109aff;
}

#service-pricing .custom-box-pricing ul li:before,#service-pricing .featured-pricing  ul li:before{
	color:white;
}
#service-pricing .pricing-type2 ul li,.fix-ul-list ul li{
	margin-bottom: 12px;
}
.pricing-type2 ul{
    text-align: left;
    margin-bottom: 2rem;
}
.featured-pricing .text-center >* {
	color:white;
}
.featured-pricing .text-center a{
	color:#109aff;
}
.featured-pricing .text-center .sub{
	opacity: 0.8;
	color:white;
}
.box-event-content h2{
    font-size: 2.25rem;
    line-height: 2.5rem;
    font-weight: 700;
}
.box-event-content h3{
	font-size: 2.25rem;
    line-height: 2.5rem;
	color:#eab308;
	margin-top:6px;
	font-weight: 700;
	margin-bottom: 12px;
}
.box-event-content ul{
	margin-bottom: 2rem;
}
.box-event-content ul li:before{
	content: "\eb7b";
	background: rgb(16 154 255 / 0.1);
	padding: 0.25rem;
    justify-content: center;
    display: flex;
    align-items: center;
    width: 1.5rem;
    height: 1.5rem;
    margin-right: 0.75rem;
    margin-top: 0.125rem;
    border-radius: 99px;
}
.box-event-content ul li{
	color:#374151;
	display: flex;
	align-items: flex-start;
	margin-top:12px;
}
.prose h1, .prose h2, .prose h3, .prose h4, .prose h5, .prose h6 {
    color: #2d3748;
    margin-bottom: 0.5em;
}

.prose p {
    margin-bottom: 1em;
    font-size: 1.15em;
    line-height: 1.6;
}

.prose ul, .prose ol {
    margin-bottom: 1em;
}

.prose li {
    margin-bottom: 12px;
    font-size: 1.15em;
}

.prose ul li:before{
	content: "\eb7b";
}

.prose strong {
    font-weight: 600;
    color: #2d3748;
}

.prose a {
    color: #109aff;
    text-decoration: underline;
}

.prose a:hover {
    color: #0066cc;
}

.single-post #breadcrumbs{
	margin-bottom: 16px;
}
.form-contact br {
    display: none;
}
.form-contact .wpcf7-form-control-wrap {
    position: relative;
    margin-bottom: 20px;
    display: block;
}
.form-contact input:not(.wpcf7-submit),.form-contact textarea,.form-contact select{
    outline: 2px solid transparent;
    outline-offset: 2px;
    font-size: 0.875rem;
    line-height: 1.25rem;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    padding-left: 1rem;
    padding-right: 1rem;
    border:1px solid #d1d5db;
    border-radius: 16px;
    display: block;
    width: 100%;
}
.form-contact select{
	margin-top:8px;
}
.form-contact input:not(.wpcf7-submit):focus,.form-contact textarea:focus,.form-contact select:focus{
	box-shadow: rgba(16, 154, 255, 0.1) 0px 0px 0px 3px;
    transition: 0.2s;
    border: 1px solid rgba(16, 154, 255, 0.9);
}
.form-contact textarea{
	max-height: 105px;
	margin-top:5px;
}
.form-contact label:not(.wpcf7-form-control-wrap){
	font-weight: 500;
	font-size: 0.875rem;
    line-height: 1.25rem;
    color:#374151;
}
.form-contact input.wpcf7-submit{
    width: 100%;
    padding-top: 1rem;
    padding-bottom: 1rem;
    font-weight: 600;
    color:#fff;
    cursor: pointer;
    border-radius: 8px;
    white-space: nowrap;
    display: block;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}
.form-contact .wpcf7-list-item label{
	display: flex;
    gap: 10px;
    align-items: center;
    font-weight: normal;
}
.form-contact .wpcf7-list-item label .wpcf7-list-item-label{
	color:#6b7280;
}
.form-contact .wpcf7-list-item label:hover .wpcf7-list-item-label{
	color:#109aff;
}
.form-contact .wpcf7-list-item.first{
	margin-left: 0;
}
.form-contact .wpcf7-list-item label input{
    width: 18px;
    height: 18px;
}
.form-contact .wpcf7-form-control.wpcf7-radio{
    display: inline-block;
    margin: 10px 0 0;
}
.form-contact .wpcf7-not-valid-tip{
    margin-left: 5px;
    margin-top: 5px;
    font-size: 14px;
}
.form-contact input.wpcf7-submit:hover{
    background-color: #16a34a;
}
.grid-contact{
	display: grid;
}
.grid-contact.contact-twocol{
    grid-template-columns: repeat(2, 1fr);
    grid-column-gap: 20px;
    margin-bottom: 10px;
    grid-row-gap: 15px;
}
.grid-contact .contact-col{
	display: flex;
    flex-direction: column;
    gap: 20px;
}
.form-digitalads .grid-contact input,.form-hosting .grid-contact input,.form-mautheme input{
	margin-top: 8px;
}
.form-digitalads p{
    text-align: left;
}
.form-hosting .choose-domain .flex .name{
	width: 85%;
}
.form-hosting .choose-domain .flex .sub select{
	margin-top:0;
}
.form-hosting .choose-domain .flex .sub select{
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}
.form-hosting .choose-domain .flex input{
	width: 100%;
    border-right: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.contact-item p label{
	display: block;
	margin-bottom: 8px;
}
.form-contact.form-global .wpcf7-form-control-wrap{
    margin-bottom: 0;
}
.form-contact.form-global .mota{
    margin-top:20px;
}
.cf7-form-content .form-global .grid-contact.contact-twocol,.form-webapp .grid-contact.contact-twocol,.form-contact.form-global .mota{
    margin-bottom: 20px;
}
.form-digitalads .grid-contact.contact-twocol .wpcf7-form-control-wrap,.form-hosting .grid-contact.contact-twocol,.form-contact.form-lienhe .wpcf7-form-control-wrap{
    margin-bottom: 0;
}
.form-hosting .form-email input{
    margin-top: 8px;
}
.form-webapp .grid-contact.contact-twocol .wpcf7-form-control-wrap{
    margin-bottom: 0;
}
.form-contact.form-lienhe .dichvu,.form-contact.form-lienhe .mota {
    margin-bottom: 20px;
}
/* CF7 Modal Styles */
.cf7-modal .cf7-form-content {
  max-height: 80vh;
  overflow-y: auto;
}

.cf7-modal .cf7-form-content form {
  margin: 0;
}

.cf7-modal .cf7-form-content input[type="text"],
.cf7-modal .cf7-form-content input[type="email"],
.cf7-modal .cf7-form-content input[type="tel"],
.cf7-modal .cf7-form-content input[type="url"],
.cf7-modal .cf7-form-content textarea,
.cf7-modal .cf7-form-content select {
  width: 100%;
  padding: 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.5rem;
  font-size: 1rem;
  transition: border-color 0.2s ease;
}

.cf7-modal .cf7-form-content input[type="text"]:focus,
.cf7-modal .cf7-form-content input[type="email"]:focus,
.cf7-modal .cf7-form-content input[type="tel"]:focus,
.cf7-modal .cf7-form-content input[type="url"]:focus,
.cf7-modal .cf7-form-content textarea:focus,
.cf7-modal .cf7-form-content select:focus {
  outline: none;
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.cf7-modal .cf7-form-content label {
  /*display: block;*/
  margin-bottom: 0.5rem;
  font-weight: 500;
  color: #374151;
}

.cf7-modal .cf7-form-content .wpcf7-submit {
  background-color: #3b82f6;
  color: white;
  padding: 0.75rem 1.5rem;
  border: none;
  border-radius: 0.5rem;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.2s ease;
  width: 100%;
  margin-top: 20px;
}

.cf7-modal .cf7-form-content .wpcf7-submit:hover {
  background-color: #16a34a;
}

.cf7-modal .cf7-form-content .wpcf7-submit:active {
  transform: translateY(1px);
}

.cf7-modal .cf7-form-content .wpcf7-response-output {
  margin: 1rem 0 0 0;
  padding: 0.75rem;
  border-radius: 0.5rem;
  font-size: 0.875rem;
}

.cf7-modal .cf7-form-content .wpcf7-response-output.wpcf7-mail-sent-ok {
  background-color: #d1fae5;
  color: #065f46;
  border: 1px solid #a7f3d0;
}

.cf7-modal .cf7-form-content .wpcf7-response-output.wpcf7-validation-errors {
  background-color: #fef2f2;
  color: #991b1b;
  border: 1px solid #fecaca;
}

.cf7-modal .cf7-form-content .wpcf7-response-output.wpcf7-spam-blocked {
  background-color: #fef3c7;
  color: #92400e;
  border: 1px solid #fed7aa;
}

.cf7-modal .cf7-form-content .wpcf7-not-valid-tip {
  color: #dc2626;
  font-size: 0.875rem;
  margin-top: 0.25rem;
}

.cf7-modal .cf7-form-content .wpcf7-form-control-wrap {
  margin-bottom: 1rem;
}

.cf7-modal .cf7-form-content .wpcf7-form-control-wrap:last-child {
  margin-bottom: 0;
}

.social-icon .youtube{
    background-color:#fef2f2;
}
.social-icon .youtube div{
    background-color: #dc2626;
}
/*BLOG*/
.article-content p:empty{
    display: none;
}
.article-content h2, .article-content h3, .article-content h4, .article-content h5, .article-content h6{
    font-weight: 700;
}
.article-content h2{
    font-size: 30px;
}
.article-content h3{
    font-size: 26px;
}
.article-content h4{
    font-size: 22px;
}
.article-content h5{
    font-size: 18px;
}
.article-content h6{
    font-size: 16px;
}
.article-content figure{
    margin-bottom: 1.5rem;
}
.blog-title {
	height:56px;
}
#posts-carousel-next, #posts-carousel-prev,#portfolio-carousel-prev,#portfolio-carousel-next,#box-image-btn-prev,#box-image-btn-next {
	position: absolute;
	width: 40px;
    height: 40px;
}
#posts-prev-btn,#portfolio-carousel-prev,#box-image-btn-prev {
	left: -70px;
}
#posts-next-btn,#portfolio-carousel-next,#box-image-btn-next{
	right: -70px;
}
.portfolio-text p{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    height:48px;
}
#templateDetailModal .scrollable-preview{
	max-height:450px;
}
#closeModalBtn,.close-btn,.cf7-modal-close{
	width: 40px;
    height: 40px;
    background: #109affe6;
    border-radius: 99px;
    padding: 0;
    display: block;
    color:#fff;
    position: absolute;
    right: 10px;
}
#closeModalBtn:hover,.cf7-modal-close:hover,.close-btn:hover{
	opacity: 0.8;
}
.wpcf7-spinner{
	display: none!important;
}
.service-title h1{
    line-height: 1.2;
}
@media (max-width: 768px){
    .bg-event-hide{
        display: none;
    }
    .btn-xemgiaodien{
        justify-content: center!important;
    }
}
@media (max-width: 600px){
	.form-contact .wpcf7-form-control.wpcf7-radio{
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-column-gap: 10px;
		grid-row-gap: 10px;
	}
	.form-contact .wpcf7-list-item{
		margin-left: 0;
	}
	#posts-carousel-next, #posts-carousel-prev, #portfolio-carousel-prev, #portfolio-carousel-next, #box-image-btn-prev, #box-image-btn-next{
		display: none;
	}
    .grid-contact.contact-twocol {
        grid-template-columns: repeat(1, 1fr);
    }
    .modal-panel h3{
        font-size:20px;
    }
}