/* 
 Theme Name:   health-child
 Theme URI:    
 Description:  
 Author:       
 Author URI:   
 Template:     vw-health-coaching
 Version:      1.0

 /* == Add your own styles below this line ==
--------------------------------------------*/
:root {
    --color-444444: #444444;
    --color-000000: #000000;
    --color-2ecc71: #2ecc71;
    --color-ffffff: #ffffff;
    --color-3890cb: #3890cb;
    --color-686868: #686868;
    --color-313a43: #313a43;
    --color-dddddd: #dddddd;
    --color-333333: #333333;
    --color-55acee: #55acee;
    --color-da4835: #da4835;
    --color-007bb5: #007bb5;
    --color-3c5a99: #3c5a99;
    --color-bbbbbb: #bbbbbb;
    --color-5b5b5b: #5b5b5b;
    --color-d12122: #d12122;
    --color-d6249f: #d6249f;
    --color-fdf497: #fdf497;
    --color-fd5949: #fd5949;
    --color-6c6c6c: #6c6c6c;
    --color-e1e1e1: #e1e1e1;
    --color-a5a9ad: #a5a9ad;
    --color-383838: #383838;
    --font-Poppins: 'Poppins';
}

@media screen and (min-width: 1000px) {
    .sf-arrows .sf-with-ul:after {
        content: '';
        position: absolute;
        top: 50%;
        right: 2px;
        margin-top: -2px;
        height: 0;
        width: 0;
        border: 5px solid transparent;
        border-top-color: var(--color2);
    }
}

h1 {
    font-size: clamp(2rem, 4vw, 2.5rem) !important;
    color: #2ecc71;
    padding: 0 15px;
}

h2 {
    font-size: clamp(1.6rem, 3vw, 2rem) !important;
    font-weight: 600;
    color: var(--color-002b46);
}

h3 {
    font-size: clamp(1.4rem, 3vw, 1.6rem) !important;
}

.colored {
    color: #2ecc71;
}

.img_el {
    padding: 80px 0;
    position: relative;
}

.img_el:before {
    content: "";
    background: color-mix(in srgb, #00000091, transparent 30%);
    position: absolute;
    inset: 0;
    z-index: 2;
    border-radius: 15px;
}

.img_el .img_el-bg {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
    border-radius: 15px;
}

.img_el .container {
    position: relative;
    z-index: 3;
}

.img_el .container p {
    color: white;
}

.img_el .container h3 {
    color: white;
}

.img_el .container ul li {
    color: white;
}

.box {
    background-color: rgba(0, 0, 0, 0.7);
    padding: 21px 11px;
    border-radius: 15px;
    height: 100%;
}

.dark_bg {
    background-color: #313a43;
    color: white;
    border-radius: 15px;
}

.dark_bg h3 {
    color: white;
}

.features-box-icon i {
    padding: 16px;
    background-color: #2ecc71;
    text-align: center;
    border-radius: 50px;
    height: 65px;
    width: 65px;
    color: white;
    margin-right: 7px;
}

.features-box:hover .features-box-icon i,
.feature_box:hover i,
.record-box:hover i,
#our_records .section_main_heading:hover a {
    -webkit-transition: 0.70s;
    -moz-transition: 0.70s;
    -ms-transition: 0.70s;
    -o-transition: 0.70s;
    -webkit-transform: rotateY(360deg);
    -moz-transform: rotateY(360deg);
    -o-transform: rotateY(360deg);
    -ms-transform: rotateY(360deg);
    transform: rotateY(360deg);
}

.features-box-icon:hover i {
    background-color: var(--color-ffffff);
    border: 2px solid var(--color-2ecc71);
    color: var(--color-2ecc71);
    transition: 1s;
}

.icon i {
    padding: 19px;
    background-color: #2ecc71;
    text-align: center;
    border-radius: 50px;
    height: 70px;
    width: 70px;
    color: white;
    margin-right: 7px;
}

.box-first {
    position: relative;
    background-image: url('/wp-content/themes/health-child/assets/images/kan-dam-nam.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color: white;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 20px;
    z-index: 1;
}

.box-first::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    z-index: -1;
    border-radius: inherit;
}

.light_bg {
    background-color: #bdbcbc;
    padding: 11px;
    border-radius: 15px;
}

.small_img_sec {
    position: relative;
}

.small_img_sec img {
    position: absolute;
    top: -33px;
    right: -33px;
}

.small_img_sec p:first-of-type {
    padding-top: 16px;
}

@media screen and (max-width: 1200px) {
    .small_img_sec p:first-of-type {
        padding-top: 33px;
    }
}


.small_img_sec h2 {
    padding-right: 85px;
}

.main-navigation ul.sub-menu a:hover {
    color: #2ecc71;
    padding-left: 0 !important;
}

.main-navigation ul.sub-menu>li>a:hover:before {
    opacity: 1;
    left: 0 !important;
    width: 20px;
}

.main-navigation ul ul {
    display: none;
    position: absolute;
    background: #fff;
    min-width: max-content;
    z-index: 9999;
    top: 70%;
    border-top: 4px solid #2ecc71;
    border-bottom: 4px solid #2ecc71;
    line-height: 30px;
    border-radius: 5px;
}

/* images-page */

.service-box-shortcodes,
.team-box,
.testimonial_box {
    border: 1px solid var(--color-dddddd);
    padding: 15px;
    text-align: center;
    box-shadow: 0px 0px 18px 0px rgb(10 27 95 / 10%);
    -webkit-box-shadow: 0px 0px 18px 0px rgb(10 27 95 / 10%);
    position: relative;
    top: 0;
    height: 100%;
}

.team-box h2 {
    color: #2ecc71 !important;
}

.team-box p {
    color: #4b4b4b !important;
}

.places {
    max-height: 1679px;
    overflow-y: scroll;
}

@media screen and (max-width: 1400px) {
    .places {
        max-height: 1622px;
    }
}

@media screen and (max-width: 1200px) {
    .places {
        max-height: 1697px;
    }
}

@media screen and (max-width: 991px) {
    .places {
        max-height: 2058px;
    }
}

@media screen and (max-width: 767px) {
    .places {
        max-height: 1058px;
    }
}

@media screen and (max-width: 538px) {
    .places {
        max-height: 1200px;
    }
}

.places::-webkit-scrollbar {
    height: 3px;
    width: 5px;
}

.places::-webkit-scrollbar-thumb {
    background-color: #13960fa9;
    border-radius: 4px;
}

.places::-webkit-scrollbar-thumb:hover {
    background-color: #555;
}

.places::-webkit-scrollbar-track {
    background-color: #f4f4f4;
    border-radius: 4px;
}

.box-second h3 {
    color: white;
}

.custom_box {
    background-color: #85858529;
    padding: 5px 15px;
    border-radius: 25px;
    height: 100%;
}



/* faq */

.collapse:not(.show) {
    display: none;
}

.accordion-button {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    padding: 1rem 1.25rem;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    background-color: #fff;
    border: 0;
    border-radius: 0;
    overflow-anchor: none;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out, border-radius .15s ease;
}

@media (prefers-reduced-motion:reduce) {
    .accordion-button {
        transition: none;
    }
}

.accordion-button::after {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    margin-left: auto;
    content: "";
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-size: 1.25rem;
    transition: transform .2s ease-in-out;
}

@media (prefers-reduced-motion:reduce) {
    .accordion-button::after {
        transition: none;
    }
}

.accordion-button:hover {
    z-index: 2;
}

.accordion-button:focus {
    z-index: 3;
    border-color: #86b7fe;
    outline: 0;
    box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25);
}

.accordion-header {
    margin-bottom: 0;
}

.accordion-item {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, .125);
}

.accordion-item:first-of-type {
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem;
}

.accordion-item:first-of-type .accordion-button {
    border-top-left-radius: calc(.25rem - 1px);
    border-top-right-radius: calc(.25rem - 1px);
}

.accordion-item:not(:first-of-type) {
    border-top: 0;
}

.accordion-item:last-of-type {
    border-bottom-right-radius: .25rem;
    border-bottom-left-radius: .25rem;
}

.accordion-item:last-of-type .accordion-button.collapsed {
    border-bottom-right-radius: calc(.25rem - 1px);
    border-bottom-left-radius: calc(.25rem - 1px);
}

.accordion-item:last-of-type .accordion-collapse {
    border-bottom-right-radius: .25rem;
    border-bottom-left-radius: .25rem;
}

.accordion-body {
    padding: 1rem 1.25rem;
}



.faq-main-box .accordion-button::after {
    background-image: url("https://preview.vwthemesdemo.com/vw-health-coach-pro/wp-content/themes/vw-health-coach-pro/assets/images/faqplus.png") !important;
}

.flex_list {
    display: flex;
    flex-wrap: wrap;
    column-gap: 21px;
}

.main-navigation a {
    font-size: 15px;
}

.tg {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
}

.tg td {
    border-color: black;
    border-style: solid;
    border-width: 1px;
    font-family: Arial, sans-serif;
    font-size: 14px;
    overflow: hidden;
    padding: 10px 5px;
    word-break: normal;
}

.tg th {
    border-color: black;
    border-style: solid;
    border-width: 1px;
    font-family: Arial, sans-serif;
    font-size: 14px;
    font-weight: normal;
    overflow: hidden;
    padding: 10px 5px;
    word-break: normal;
}

.tg .tg-fymr {
    border-color: inherit;
    font-weight: bold;
    text-align: left;
    vertical-align: top
}

.tg .tg-0pky {
    border-color: inherit;
    text-align: left;
    vertical-align: top
}

/* From Uiverse.io by Praashoo7 */
.card {
    width: 100%;
    height: 100%;
    background: #232925;
    transition: 1s ease-in-out;
    clip-path: polygon(30px 0%, 100% 0, 100% calc(100% - 30px), calc(100% - 30px) 100%, 0 100%, 0% 30px);
    border-top-right-radius: 20px;
    border-bottom-left-radius: 20px;
    display: flex;
    flex-direction: column;
    padding-bottom: 11px;
}

.card h2 {
    font-weight: bold;
    color: white;
    text-align: center;
    display: block;
    font-size: 1em
}

.card .info {
    font-weight: 400;
    color: white;
    display: block;
    text-align: center;
    font-size: 15px;
    margin: 0 1em;
}

.card .img {
    /* width: 4.8em;
    height: 4.8em; */
    background: white;
    border-radius: 15px;
    margin: 0 auto;
}


.card .share {
    margin-top: 1em;
    display: flex;
    justify-content: center;
    gap: 1em;
}

.card a {
    color: white;
    transition: .4s ease-in-out;
}

.card a:hover {
    color: red;
}

.card button {
    padding: 0.8em 1.7em;
    display: block;
    margin: auto;
    border-radius: 25px;
    border: none;
    font-weight: bold;
    background: #ffffff;
    color: rgb(0, 0, 0);
    transition: .4s ease-in-out;
}

.card button:hover {
    background: red;
    color: white;
    cursor: pointer;
}

.brand_icon {
    padding: 11px;
    border-radius: 50%;
    background-color: #212529;
}

.main-header-inner {
    background: #303942;
}

.logo-inner {
    display: inline-block;
    background: #303942;
    padding: 15px;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
}

.main-navigation ul ul a {
    border-bottom: none;
    text-align: start;
    padding-left: 20px;
}

/* .main-navigation ul li:hover>ul {
    display: none !important;
} */

.sidenav {

    cursor: pointer;
}

.main-navigation ul.sub-menu a:hover {
    color: #2ecc71;
    padding-left: 20px !important;
}

@media screen and (max-width: 840px) {
    .main-navigation ul.sub-menu a {
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        max-width: 300px;
    }
}

#sidebar ul li a {
    color: #222223;
    letter-spacing: 1px;
    font-size: 15px;
}

#sidebar .widget {
    padding: 20px;
    border: solid 1px #e1e1e1;
    margin-bottom: 25px;
    box-shadow: 0px 15px 10px -15px #999;
}

/* From Uiverse.io by PriyanshuGupta28 */
/* Unique styles for the newsletter form */
.newsletter-form {
    max-width: 400px;
    margin: 0 auto;
    padding: 20px;
    border: 2px solid #333;
    border-radius: 8px;
    background-color: #f7f7f7;
    font-family: Arial, sans-serif;
    box-shadow: rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px;
}

.heading {
    font-weight: bold;
    font-size: 20px;
}

.newsletter-form h2 {
    margin-top: 0;
    color: #333;
    font-size: 24px;
}

.newsletter-form label {
    display: block;
    font-weight: bold;
    color: #666;
    margin-bottom: 10px;
}

.newsletter-form input[type="email"] {
    width: 100%;
    padding: 10px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.newsletter-form input[type="submit"] {
    width: 100%;
    padding: 10px;
    border: none;
    border-radius: 4px;
    background-color: #ff6600;
    color: #fff;
    font-weight: bold;
    cursor: pointer;
}

.newsletter-form input[type="submit"]:hover {
    background-color: #ff8533;
}

/* From Uiverse.io by Randdose */
.button_custom {
    all: unset;
    display: flex;
    align-items: center;
    position: relative;
    padding: 0.6em 2em;
    border: mediumspringgreen solid 0.15em;
    border-radius: 0.25em;
    color: white;
    font-size: 1.5em;
    font-weight: 600;
    cursor: pointer;
    overflow: hidden;
    transition: border 300ms, color 300ms;
    user-select: none;
}

.button_custom a {
    z-index: 1;

}

#footer a {
    color: white !important;
    text-decoration: none;
}

.button_custom:hover {
    color: #e6e6e6;
}

.button_custom:active {
    border-color: teal;
}

.button_custom::after,
.button_custom::before {
    content: "";
    position: absolute;
    width: 9em;
    aspect-ratio: 1;
    background: mediumspringgreen;
    opacity: 50%;
    border-radius: 50%;
    transition: transform 500ms, background 300ms;
}

.button_custom::before {
    left: 0;
    transform: translateX(-8em);
}

.button_custom::after {
    right: 0;
    transform: translateX(8em);
}

.button_custom:hover:before {
    transform: translateX(-1em);
}

.button_custom:hover:after {
    transform: translateX(1em);
}

.button_custom:active:before,
.button_custom:active:after {
    background: teal;
}

.wpcf7-form-control-wrap {
    position: relative;
}

.faq-contact-box input[type="text"],
.contact-box .wpcf7 input[type="text"],
.contact-box .wpcf7 input[type="email"],
.contact-box .wpcf7 input,
.contact-box .wpcf7 textarea,
.contact-box .wpcf7 select,
.faq-contact-box .wpcf7 input[type="email"],
.faq-contact-box .wpcf7 input,
.faq-contact-box .wpcf7 textarea,
.faq-contact-box .wpcf7 select {
    font-size: 16px;
    padding: 15px 10px;
    margin: 0 12px 23px 0;
    height: auto;
}

.contact-box-inner-sec {
    background-color: #313a43;
    position: relative;
}

.contact-box-inner-sec i {
    width: 60px;
    height: 60px;
    line-height: 2.5em;
    border-radius: 50%;
    background-color: var(--color-2ecc71);
    color: #fff;
    font-size: 24px;
    text-align: center;
    position: absolute;
    right: 0.5em;
    top: -1em;
}

.error_page {
    height: 60vh;
}

h1 {
    font-size: clamp(2rem, 4vw, 2.5rem) !important;
    color: #2ecc71;
    padding: 0 10px;
}

.entry-content a {
    color: #137f41;
    text-decoration: underline;
}




/* sadasdasd */

.main-navigation ul li ul {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    top: 100%;
    left: 0;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.main-navigation .show {
    opacity: 1;
    visibility: visible;
    display: block !important;
}