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

/*************** ADD CUSTOM CSS HERE.   ***************/
body, html, h1, h2, h3, h4, h5, h6,p, span, .button {font-family: proxima-nova, sans-serif!important;}
h2 {font-size:42px;line-height:1.2}
h3 {font-size:34px;font-weight:700!important;}
span{color:#366AC2;}
a span{color:#000;}
i.icon-angle-right {display:none;}

.mobile-sidebar{ background:#366AC2 !important;}
.mobile-sidebar .menu-item { border:0!important;}
.mobile-sidebar .menu-item a, .mobile-sidebar span { font-weight:600; color:#fff;text-transform:capitalize;font-size:16px;}

#top-bar {background:transparent;}
.header-nav a.num {font-size:18px; text-transform:uppercase;font-weight:600!important;font-family: proxima-nova;color:#366AC2 !important;margin:0;padding:6px 0;}
.header-nav a.num i {padding-right:4px;}
.header-nav a.num:hover{color:#222!important;}
.nav-line-bottom > li > a.num:before{ display:none; }
.nav>li>a {font-size:16px; font-weight:400;}

.button {text-transform:capitalize!important;font-weight:500!important;}
.button:hover, .button.is-outline:hover { border:1px solid #3342B8;}
.button span{color:#fff;} 
.button.secondary { color:#fff;font-weight:500!important;}
.button.secondary:hover, .button.white:hover { background:#3342B8!important;}
.button.is-outline {border:1px solid #fff;}
.button.white.is-outline span, .button.secondary:hover span, .button.secondary:hover i, .button.white:hover span, .button.white.is-outline:hover i {color:#fff;}

.icon-angle-right:before {content:"\e30b"; font-family:"Font Awesome 5 Free";font-size:18px;}
.icon-angle-right:before ,.icon-phone:before{vertical-align:top;}
.faqs .icon-angle-down:before { content:"+";font-size:20px;vertical-align:top;color:#fff;font-weight:900!important;}

.tcs-download {text-align:center;}
.tcs-download a i{display:block;font-size:23px;margin-bottom:10px; color:#366AC2;}
.tcs-download a span {font-size:20px;font-weight:600;line-height:20px;color:#366AC2;}
.tcs-download a:hover span, .tcs-download a:hover i {color:#222;transition:all ease 500ms;-webkit-transition:all ease 500ms;-moz-transition:all ease 500ms;}

select, .select-resize-ghost, .select2-container .select2-choice, .select2-container .select2-selection {
  box-shadow:none;
  border:1px solid #366AC2;
  background:#f7f7f7;
  border-radius:3px;
}

/* Banner */
.banner p {font-size:20px;} 

/*Pages*/
.h-banner .bg-fill { background-size:contain!important;background-position:60% 0%!important;}
.m-title { text-transform:uppercase;font-weight:900!important;margin-top:0!important;letter-spacing:1px;}
.s-title { font-weight:300!important;font-size:28px!important;margin:0!important;}
.bucket .bucket-item .col-inner{ box-shadow:0 0 8px 0px #2222221c}

.offer .section-bg{ background-size:contain!important;background-position:left top;}

.cta .m-title { font-size:42px;margin:10px 0;}
.cta .s-title { font-size:35px!important;margin:10px 0!important;}
.cta .lead {font-size:24px;}

.faqs .accordion_title {font-weight:800;margin-bottom:40px;}
.faqs .accordion .accordion-title span {color:#fff;vertical-align:middle;font-weight:600;}

.section.has-block span{color:#000;}
.section.has-block .ux-menu-title { text-transform:capitalize;font-size:18px;}

.cf7 .row:first-child{ max-width:620px;margin:auto;text-align:center;box-shadow:0px 5px 15px 0px #f7f5f5;padding-top:10px;}
.cf7 .wpcf7 .col {padding-bottom:10px!important;text-align:left;}
.cf7 .wpcf7 input, .cf7 .wpcf7 textarea{border:1px solid #366AC2;resize:none;border-radius:3px;background:#f7f7f7;}
.cf7 .wpcf7 input[type="submit"]{width:100%;border-radius:100px;font-weight:700;}

.tpane-row {margin:auto!important;}
.tpane-row .nav-col .button { padding:0!important;border-bottom:1px solid #d8d8d8!important;text-align:left;}
.tpane-row .nav-col .button span{line-height:1;font-size:18px; padding-bottom:20px;}
.tpane-row .col-plan-des {}
.tpane-row .col-plan-des .price-ribbon span {background: #4CAF50 ;padding:5px 20px;color: #fff;font-weight: 700;}
.tpane-row .col-plan-des ul {margin:0;list-style:none;}
.tpane-row .col-plan-des ul.plan-cover li i {font-size:16px;position:absolute;color:#CDDC39;left:10px;}
.tpane-row .col-plan-des ul.plan-cover li, .tpane-row .col-plan-des ul.plan-featured li { padding-left:10px;}
.tpane-row .col-plan-des ul.plan-featured {}
.tpane-row .col-plan-des ul.plan-featured li i {font-size:16px;position:absolute;color:#3F51B5;left:10px;}

.col-plan-des .pricing-table-wrapper .bullet-item {border:0;}
.col-plan-des .pricing-table-wrapper .bullet-item span { color:#000;}
.col-plan-des .pricing-table-wrapper .bullet-item span:before {content:"\f005 "; font-family:"Font Awesome 5 Free";color:#FF5722;}
.col-plan-des .pricing-table-wrapper .silver .title{ background:#c0c0c021;}
.col-plan-des .pricing-table-wrapper .gold .title{ background:#FFD700;}
.col-plan-des .pricing-table-wrapper .platinum .title{ background:#AED3FF;}

.bullet-item {border:0;}
.bullet-item span { color:#000;}
.bullet-item span:before {content:"\e005 "; font-family:"Font Awesome 5 Free";color:#FF5722;}


.plan .tabbed-content h4 { padding:20px auto;margin-bottom:30px;text-transform:capitalize;font-size:24px;}

.plan .nav .tab a span{ font-weight:700;color:#bfbfbf;}
.plan .nav .tab.active a span, .plan .nav .tab:hover a span { color:#366AC2;}

.nav-col {position:relative;}
.nav-col .col-inner {position:sticky;top:320px;}

.acceptance .wpcf7-acceptance {text-align:left;}
.acceptance .wpcf7-acceptance input[type="checkbox"] {position:absolute;left:0;}
.acceptance .wpcf7-acceptance span.wpcf7-list-item-label {position:relative;left:25px;max-width:580px;}

.banner .wpcf7 input {border:0;background:transparent;box-shadow:none;border-bottom:1px solid #222;}
.banner .wpcf7 input::placeholder { color:#222;}
.banner .wpcf7-acceptance .wpcf7-list-item-label{ color:#222;font-size:13px;}
.banner .wpcf7 input[type="submit"]{border:0;font-size:16px;margin:20px auto;display:block;width:100%;border-radius:5px;text-transform:uppercase!important;}

.wc-pao-addon .wc-pao-addon-wrap,.wc-pao-addon .wc-pao-addon-wrap label {margin:0;font-weight:500;}
.product-info .breadcrumbs {display:none;}
button.single_add_to_cart_button.button.alt.disabled.wc-variation-selection-needed { color:#000;opacity:1;display:block;width:100%;border-radius:100px;}
button.single_add_to_cart_button.button.alt.disabled.wc-variation-selection-needed:hover {background:#0073c4;color:#fff;}
.accordion { background:#fbfbfb;}
.accordion-title {background:transparent!important;font-size:20px;border-top-width:2px;}


.tab-panel .row {margin:0 auto!important;}

/***************
Table price
***************/

.table, td {border:0;font-size:18px;}
.h-title {text-transform:uppercase;font-weight:600;}
.table tr td {text-align:center; padding:20px 20px;border-bottom:1px solid #b7b7b7;}
.table tr td:first-child {text-align:left;background:#366AC2d4;color:#fff;border:0;}
.table tr td i.fa-check {color:#009d2f;}
.table tr td i.fa-times {color:#9e9e9e87;}
.table tr:hover td:first-child {background:transparent;color:#666;transition:all ease 500ms;}

/*************** ADD MOBILE ONLY CSS HERE  ***************/


@media only screen and (max-width: 1024px) {
  .h-banner .bg-fill {background-position:bottom!important;padding-top:200px!important;}
  .h-banner {padding-top:550px!important;}
  .h-banner .text-box {left:2%;}
  .faqs .bg-fill {background-position:right!important;}
  .offer { padding:0!important;}
  .offer .bg-fill{background-size:320px!important;background-position:center left;}
  .offer .row .col {border:0!important;padding:0;}
}
@media only screen and (max-width: 967px) {
  .button.icon.is-small { font-size:20px;border:1px solid #fff;}

  .faqs .bg-fill {background-position:right bottom!important;background-size:contain!important;background-color:#d78400;}
  .offer {padding:50px 40px!important;}
  .offer .row .col { max-width:100%!important;flex-basis:100%;}
  .offer .bg-fill {background-image:none!important;background-color:#e3f2f7;}

  .h-banner{padding-top:400px!important;}
}
@media only screen and (max-width: 768px) {
  .h-banner .text-box { width:50%!important;top:45%;}
  .table {
    display: block;
  }
  
  .table, thead, tbody, th, td, tr {
    display: block;
  }

  tr.h-title {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }

  tr {
    border: 1px solid #ccc;
 
  }
  .table tr td { position:relative;}
  .table tr td:first-child  { text-align:center;}
  .table tr td:before { font-size:13px;text-transform:uppercase;font-weight:600;text-align:left;color:#ccc; }
  .table tr td.deductible:before { content:"Deductible";}
  .table tr td.standard:before { content:"Standard";}
  .table tr td.accidental:before { content:"Accidental";}
  .table tr td.prepaid:before { content:"Prepaid";}
  .table tr td.in-home:before { content:"In-Home";}

  td {
    border: none;
    border-bottom: 1px solid #ccc;
    position: relative;
    padding-left: 50%;
  }

  td:before {
    position: absolute;
    top: 6px;
    left: 6px;
    width: 45%;
    padding-right: 10px;
    white-space: nowrap;
  }

  th {
    display: none;
  }
}
@media only screen and (max-width: 676px) {
  .faqs .bg-fill {background-size:150%!important;}
  .bucket .row .col { max-width:100%!important;flex-basis:100%;}
}
@media only screen and (max-width: 480px) {
  .h-banner { padding-top:620px!important;}
  .h-banner .text-box { width:90%!important;top:4%;left:52%;}
  .h-banner .text-box .button{display:block;margin-bottom:20px!important;font-size:18px;}
  .cta, .offer, .bucket { padding-top:50px!important;padding-bottom:30px!important;}

}