/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Cesar Sosa
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: Astra is fast, fully customizable & beautiful WordPress theme suitable for blog, personal portfolio, business website and WooCommerce storefront. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with Schema.org code integrated and is Native AMP ready so search engines will love your site. It offers special features and templates so it works perfectly with all page builders like Elementor, Beaver Builder, Visual Composer, SiteOrigin, Divi, etc. Some of the other features: # WooCommerce Ready # Responsive # RTL & Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and WooCommerce ready theme that you can use for building any kind of website!
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 1.0.1691425125
Updated: 2023-08-07 16:18:45
*/

:root{
    --golden: #DCC05E;
    --tollens: #EFD89C;
    --dark-grey: #515150;
    --grey: #7f7f7f;
    --black: #161616;
    --white: #fff;
    --black-alt:#252527;
}

body .b24-widget-button-position-bottom-left {
    left: 20px;
    bottom: 20px
}

main#primary {
    overflow: hidden;
}
/*------ Fonts ------*/
#content h1 .alt-1, #content h1.alt-1{
	font-family: 'Saira';
	font-size: 40px;
	font-weight: 100;
	line-height: 35px;
}

#content .h3-mask{
    font-family: 'Saira';
    font-size: 25px;
    line-height: 30px;
    font-weight: 100;
}

#content h1 .alt-2, #content h1.alt-2, #content h2 .alt-2 {font-size: 20px}

#content p.h2-mask, #content h3.h2-mask{
	font-size: 50px;
    line-height: 60px;
    font-weight: 600;
}
#content .p-font, #content h4.p-font{
    font-size: 18px;
    line-height: 24px;
}

#content h2.alt-1,  .footer-title, #content h3.alt-3, #content .h2-mask.alt-1{
    font-size: 30px;
    line-height: 40px;
}

#content h3.alt-1, #content .h2-mask.alt-2{
    font-size: 20px;
    line-height: 25px;
}

#content h3.alt-2{
    font-size: 25px;
    line-height: 30px;
}

#content .zona-pro, #content .font-zona-pro, #content h3.alt-2, #content h3.alt-1{font-family: 'Zona Pro', 'Montserrat'}
#content .font-saira, #colophon .font-saira{font-family: 'Saira'; font-weight: 100;}
header a.cta-btn {
    border-radius: 15px;
    padding: 10px 15px;
}
#content a.cta-btn, a.cta-btn {
    color: var(--dark, black) !important;
    border: 1px solid var(--golden);
    border-width: 1px;
    border-radius: 10px;
    background-color: var(--golden);
    padding: 15px 30px;
    font-size: 14px;
    line-height: 1em;
    width: fit-content;
    display: inline-block;
}

a.cta-btn-alt {
    color: #fff;
    border-radius: 10px;
    background-color: #272725;
    padding: 17px 20px;
    font-size: 14px;
    display: inline-block;
    line-height: 1em;
}

.cta-btn.dark-gray-btn {
    background-color: var(--dark-grey);
    border-color: var(--dark-grey);
    color: white!important;
}
.btn-container{display: inline-grid}
#content .bold, body .bold, .cta-btn{font-weight: 700}
#content .semibold, .semibold{font-weight: 600}
.medium{font-weight: 500}
#content .regular, #content p.regular{font-weight: 400}
#content .thin, #content p.thin {font-weight: 300}
#content .extra-thin{font-weight: 200}

#content .center, .center h1, .center h2, .center h3, .center h4{text-align:center}
.justify, .justify h1, .justify h2, .justify h3, .justify h4{text-align: justify}
#content .uppsercase{ text-transform: uppercase}
#content .font-80{
    font-size: 80%;
    line-height: 1.2em;
}
.fs-40 {font-size: 40px; line-height: 1.1em}
#content .font-60{font-size: 60%}
#content .font-70{font-size: 70%}
#content .font-100{font-size: 100%}
#content .font-130, .font-130{font-size: 130%}
#content .font-150{font-size: 150%}

#content .font-200{
    font-size: 200%;
    line-height: 1.1em;
}

#content p .alt-1, #content p.alt-1{
    font-size: 30px;
    line-height: 40px;
}

#content .line-height-1em{line-height: 1em}
#content .line-height-15em{line-height: 1.5em}

ul.not-list{list-style: none;}


#content .golden, .golden{color: var(--golden)}
#content .tollens{color: var(--tollens)}
.grey, .grey h1, .grey h2, .grey h3, .grey h4{color: var(--grey)}
.dark-grey, .dark-grey h1, .dark-grey h2, .dark-grey h3, .dark-grey h4{ color:var(--dark-grey)}
#content .white, .white h1, .white h2, .white h3, .white h4, #colophon .white{color: var(--white)}
.black, .black h1, .black h2, .black h3, .black h4, #content h2.black,
#content p.black{
	color: var(--dark)
}
.black-alt, .black-alt h1, .black-alt h2, .black-alt h3, .black-alt h4, #content h2.black-alt,
#content p.black-alt{color: var(--black-alt)}
ol, ul {margin: 0 0 0 20px}

#content .play-icon-45 .fa-play{font-size: 45px}
.lazy{background: var(--white)!important}

#content .fs-20{font-size:20px; line-height: 26px;}
#content .fs-16 {font-size: 16px;line-height: 19px}
#content .fs-24 {font-size: 24px; line-height: 24px}
#content .fs-30 {font-size: 30px; line-height: 40px}
#content .fs-32, #colophon .fs-32{font-size: 32px; line-height: 48px}
#content .line-height-1em, #content .lh-1em{line-height: 1em}
#content .line-height-15em, #content .lh-15em{line-height: 1.5em}
/*------ General ------*/

.bkg-lightgrey{background-color: var(--color-1, lightgrey)}
.bkg-transparent{background-color: transparent}
.bkg-white{background-color: white}
.bkg-unset{background-color: unset;}
.bkg-white-to-grey {background: linear-gradient(180deg, white, rgb(67 66 66 / 40%))}
.bkg-golden{background-color: var(--accent, #DCC05E)}
.bkg-golden-alt{background-color: #EFD89C}
.bkg-transparent-to-black{background: linear-gradient(180deg, transparent 0%, transparent 75%, #434342 100%);}
.bkg-light-grey{background-color: #f9f9f9}

.bkg-lightgrey-pattern{
    background: linear-gradient(180deg, #F9F9F9 0%, rgba(249, 249, 249, 0.80) 80%, #F9F9F9 100%), url('/wp-content/uploads/bkg-pattern.jpg') repeat;
}
.bkg-golden-alt-pattern{
    background: url('/wp-content/uploads/faq-background.jpg') repeat;
}


#content [class*="bkg-image"], #colophon [class*="bkg-image"],
[class*="bkg-img"]{
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* .splide:not(.is-initialized) .splide__slide:not(:first-child) {
    display: none;
} */

.video-overlay:before {
    content: "";
    position: absolute;
    background: #fff;
    background: linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(147,147,147,.8015581232492998) 50%,rgba(147,147,147,1) 100%);
    bottom: 0;
    left: 0;
    right: 0;
    height: 40%;
    border-radius:30px;
    z-index: 5;
}

.banner-gray-gradient{
    background: #fff;
    background: linear-gradient(180deg,rgba(255,255,255,1) 0%,rgba(212,212,212,1) 42%,rgba(183,183,183,1) 60%,rgba(92,92,92,1) 100%);
}

.reviews-background{
    background: rgb(227,227,227);
    background: linear-gradient(180deg,rgba(227,227,227,0) 0%,rgba(229,229,229,.43) 48%,rgba(135,135,135,.43) 100%);
}

.pattern-background{
    background:#fff;
    background: rgba(255, 255, 255, .6) url(https://primeadvanceddentistry.com/wp-content/uploads/Pattern_Mesa-de-trabajo-1_Mesa-de-trabajo-1.jpg?id=167);
    background-blend-mode: overlay;
}

.w50{
	max-width:49%;
	width:49%; 
	margin:auto
}

.width-48pc{
    width: 48%;
}

.br-0{border-radius: 0}
.border-radius-10, .br-10{border-radius:10px}
.border-radius-20, .br-20{border-radius: 20px}
.br-25{border-radius: 25px}
.br-25-left{
    border-top-left-radius: 25px;
    border-bottom-left-radius: 25px
}
.br-25-right{
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px
}
.border-radius-30, .br-30{border-radius:30px}
#content .overflow-hidden{overflow: hidden}
#content .overflow-visible{overflow: visible}


.flex{display:flex}
.flex.center{justify-content: center}
.flex.vertical-center{align-items: center}
.absolute{position: absolute}
.relative{position: relative}
.bottom{bottom: 0}
.bottom-32-minus{bottom: -32%}
.bottom-20-minus{bottom: -20%}

.bottom-26-minus{bottom: -26%}

.left-5-minus{left: -5%}

.left{left:0}

.lateral-inset{left: 0; right: 0}

.float-right{float:right}

.hide, .hide-m {display:none; /* It is use in <br> only for mobile*/}
.hide-d{display: block}
.z-index-10{z-index:10}
.z-index-1{z-index:1}
.width-110pc{width: 110%}
.width-100{width: 100%}

.shadow-1{box-shadow: 4px 4px 8px rgba(0,0,0,0.25)}
.shadow-2{box-shadow: 0 6px 6px rgba(0,0,0,0.16)}

/***** Header *****/

#page .transparent-header {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background-color: transparent;
    transition: background-color 0.3s ease-in-out
}
#page .ast-primary-header-bar{background-color: inherit; border: none}

#page .sticky-header {
    position: fixed!important;
    top: 0;
    left: 0;
    width: 100%;
    background-color: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    z-index: 100;
    transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

/* Modal */
.hidden-popup {
    position: fixed;
    width: 100%;
    height: 100%;
    inset: 0;
    visibility: hidden;
    overflow: auto
}
.hidden-popup.active{
    visibility: visible;
    z-index:9999999
}
#close-modal {
    width: fit-content;
    cursor: pointer;
    position: absolute;
    top: 18px;
    right: 20px;
}

.hidden-popup input.wpcf7-submit {
    width: fit-content;
    margin-left: auto;
    display: block;
    margin-right: auto;
    border-radius: 10px;
    color: #fff;
    background-color: var(--dark);
    font-size: 16px;
    font-weight: 600;
    padding: 15px 30px;
}

.hidden-popup .wpcf7 form>div{margin-bottom:0}

/***** Padding and Margins *****/
.first-content .column:first-child, .first-content .column:last-child { padding-left: 6vw; padding-right: 6vw}
.column, .row, #hero >.row > .column:first-child, #content .lateral-padding {padding-left: 6vw; padding-right: 6vw;}
.column > .column, .row >.column {
    padding-left: 0;
    padding-right: 0;
}

.column.fullwidth, .row.fullwidth {
    padding-left: 0;
    padding-right: 0;
}

#content main > section{padding-top: 48px; padding-bottom:24px}
#content main > section.no-padding{padding: 0}
#content .padding-top-5pc{padding-top: 5%}
#content .padding-top-200{padding-top: 200px}
#content .padding-top-0{padding-top: 0px}
#content .padding-top-48{padding-top: 48px}
#content .padding-top-130{padding-top: 130px}
#content .padding-bottom-0{padding-bottom: 0px}
#content .padding-bottom-80{padding-bottom: 80px}
#content .padding-bottom-120{padding-bottom: 120px}
#content .padding-bottom-180{padding-bottom: 180px}
#content .vertical-margin-auto{margin-top: auto; margin-bottom: auto}
#content .margin-bottom-0{margin-bottom: 0}
#content .margin-bottom-8{margin-bottom: 8px}
#content .margin-bottom-16{margin-bottom: 16px}
#content .margin-bottom-24, .margin-bottom-24{margin-bottom: 24px}
#content .margin-bottom-32{margin-bottom: 32px}
#content .margin-bottom-40, .margin-bottom-40{margin-bottom: 40px}
#content .margin-bottom-48{margin-bottom: 48px}
#content .margin-bottom-64{margin-bottom: 64px}
#content .margin-bottom-80{margin-bottom: 80px}
#content .margin-bottom-96{margin-bottom: 96px}

/*------ BANNER SECTION ------*/

#content .banner-section.new-contact .absolute {width: 100%; bottom: -110px}

#content .banner-section > div:last-child {
    width: 100%;
    z-index: 10;
    bottom: -14%;
}
#content .banner-section>div.bottom--20:last-child {
    bottom: -20%;
}
.banner-section .wpcf7 input[type=submit] {
    background-color: #fff;
    color: #272725;
    font-family: 'Zona Pro';
    box-shadow: 0 3px 6px rgba(122,122,122,.5);
    padding: 15px 30px;
    margin: 0 auto 64px;
    display: block;
}
.banner-section .wpcf7 input, .banner-section .wpcf7 textarea, .banner-section .wpcf7 select {
    background-color: rgba(127,127,127,.2);
    border: none;
    color: #fff;
    font-size: 15px;
    padding: 10px;
    line-height: 1em;
}
.intl-tel-input.separate-dial-code .selected-flag{text-align:left}
.intl-tel-input.separate-dial-code .selected-flag .selected-dial-code{padding-left:22px}

.banner-section .wpcf7 input::placeholder, .banner-section .wpcf7 textarea::placeholder, .banner-section .wpcf7 select[name="your-treatment"]{color: rgba(255,255,255,0.8); font-weight:600}
.banner-section .wpcf7 select option {background-color: rgba(127,127,127,.8); color: #fff}
span.wpcf7-spinner {position: absolute; right: 0%;bottom: 10px}
#colophon .wpcf7 .wpcf7-acceptance input, #content .wpcf7-acceptance input {margin-bottom: 0}
span.wpcf7-form-control-wrap[data-name="acceptance-724"] {text-align: left; margin-bottom: 24px}
span.wpcf7-form-control-wrap[data-name="acceptance-724"] .wpcf7-list-item{margin-left:0}

/* NEw contact form */
#content .new-cf div span > input, #content .new-cf div span > select, 
#content .new-cf div span > textarea, #content .new-cf .intl-tel-input > input {
    background-color: var(--dark);
    color: white;
    font-size: 20px;
}
#content .new-cf div span > input::placeholder, #content .new-cf div span > textarea::placeholder,
.new-cf .intl-tel-input.separate-dial-code .selected-dial-code, #content .new-cf .intl-tel-input > input::placeholder {
    color: white;
}
.flag-container .selected-flag{border-right: 1px solid rgba(255,255,255,.5)}
#content .new-cf div > input.wpcf7-submit {
    border-radius: 10px;
    background-color: var(--accent, goldenrod);
}
/*------ VIDEOS YOUTUBE ------*/
iframe.responsive-iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-shadow: 0px 3px 6px 0px #0000004f;
}

.iframe-container{
    width: 100%;
    position: relative;
    padding: 0
}

.iframe-container > img{box-shadow: 0px 3px 6px 0px #0000004f}

.ar-16-9{aspect-ratio: 16/9}
.ar-9-16{aspect-ratio: 9/16}
.ar-8-15{aspect-ratio: 8/15}
.play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 50px;
    color: white;
    cursor: pointer;
}

/************ faqs **************/
.faqs-background {
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("/wp-content/uploads/tabla-FAQ.jpg");
}
.question {
    box-shadow: 0 6px 6px rgba(0,0,0,.16);
    z-index: 5;
    overflow: visible;
    display: flex;
    align-items: center;
    position: relative;
}
.answer {
    z-index: 3;
    display: none;
    top: -10px;
    position: relative;
}
.question, .answer {
    background-color: #fff;
    border-radius: 10px;
    padding: 20px 30px;
}
.faq.active .answer {
    display: block;
    -webkit-animation-name: animateOpen;
    -moz-animation-name: animateOpen;
    animation-name: animateOpen;
    -webkit-transform-origin: 50% 0%;
    -moz-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-animation-duration: .4s;
    -moz-animation-duration: .4s;
    animation-duration: .4s;
}
.faq .question p {
    width: -webkit-fill-available;
}
.faq .question .fa-question,
.new-faq summary .fa-question {
    background-color: #dcc05e;
    height: min-content;
    font-size: 20px;
    padding: 5px 7px;
    border-radius: 6px;
    color: #fff;
    margin-right: 15px;
}
.faq .question .fa-caret-down, .faq .question .fa-caret-up {
    color: #dcc05e;
    font-size: 25px;
    margin-left: auto;
}
.faq.active .fa-caret-down, .faq .fa-caret-up {display: none}
.faq.active .fa-caret-up {display: block}

.new-faq{
    cursor:pointer;
}
.new-faq .fa-chevron-up{display: none;}
.new-faq[open] .fa-chevron-up{display:block}
.new-faq[open] .fa-chevron-down{display:none}
.new-faq > div{
    top: -10px;
    position: relative;
}

/* Process points */
.process-container {
    display: grid;
    grid-template-columns: 12% 83%;
    column-gap: 5%;
}

.points .solid{
    z-index: 3;
    width: 18px;
    height: 18px;
    background-color: #DCC05E;
}

.points .dashed{
    z-index: 2;
    width: 29px;
    height: 29px;
    background-color: transparent;
    border: 1px dashed #DCC05E
}

.points .line{
    z-index: 1;
    width: 38px;
    height: 38px;
    background-color: white;
    border: 1px solid #DCC05E
}

.points .circle{
    position: absolute;
    border-radius: 50%;
    inset: 0;
    margin: auto;
}

.points{
    position:relative; 
    top: 0px;
    height: 40px;
}

.vl{
    height: 100%;
    width: 1px;
    border-left: 1px dashed #707070;
    position: relative;
    left: 50%;
    margin-left: -0px;
    top: 0;
}

/*------ HERO ------*/
#content .swiper-pagination-bullet-active {background: var(--dark-grey)}

#content #hero, #content main > section:first-child {
    padding-top: 100px;
    padding-bottom: 80px;
    background-image: url('/wp-content/uploads/dental-prime-dentist-background.png');
    background-size: cover;
    background-repeat: no-repeat;
}

#hero .hero-slider .swiper-slide, #hero .hero-slider .splide__slide{
    background: #fff;
    display: flex;
    overflow: hidden;
    border-radius:25px; /* delete */
    position: relative;
    flex-direction: column;
}

#content .hero-slider img, #content main > section:first-child .splide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: relative;
}

#hero .hero-slider .swiper-slide>div, #hero:not(.alt-hero) .hero-slider .splide__slide>div{
    width:auto;
    height:40%;
    position: absolute;
    bottom: 0;
    left:0;
    right:0;
    display:block;
    padding: 0 20px;
    text-align: left;
    background: rgb(183,183,183);
    background: linear-gradient(180deg, rgba(183,183,183,0) 0%, rgba(183,183,183,0.804359243697479) 56%, rgba(183,183,183,0.896796218487395) 80%, rgba(183,183,183,1) 100%);
}
#hero .hero-slider .swiper-slide, #hero .hero-slider .swiper-slide-duplicate,
#hero .hero-slider .splide__slide, #content main > section:first-child .splide .splide__slide{
    transform: scale(.85) translateY(-8%);
}
#hero .hero-slider .swiper-slide-duplicate-active,  #hero .hero-slider .swiper-slide-active, 
#hero .hero-slider .splide__slide.is-active, #content main > section:first-child .splide .splide__slide.is-active{
    transform: none;
}
#hero .hero-slider .swiper-horizontal>.swiper-pagination-bullets, 
#hero .hero-slider .swiper-pagination-bullets.swiper-pagination-horizontal {
    bottom: -30px;
}

/*------ Reviews Section ------*/
.circle img {border-radius: 50%}

.review-section {
    display: grid;
    grid-template-areas: "review review"
        "picture title";
    grid-template-columns: 1fr 1fr;
}
.review-section .review-container {
    padding-left: 5vw;
    padding-right: 5vw;
    grid-area: review;
}
.review-section .review-big-pic{grid-area: picture;}
.review-section .review-title{grid-area: title;}

/*------ Before and Afters ------*/
.baa-container > .flipcard {
    width: 75%;
    height: auto;
    min-height: 398px;
    perspective: 1000px;
    position: relative;
}
.baa-container>.flipcard>.fc-inner {
    transition: transform .8s;
    transform-style: preserve-3d;
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
}
.fc-front, .fc-back {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.fc-front i {
    position: absolute;
    color: #fff;
    opacity: .7;
    right: 20px;
    top: 20px;
    font-size: 20px;
}
.fc-back {
    transform: rotateY(180deg);
}
.flipcard:hover .fc-inner {
    transform: rotateY(180deg);
}
.baa-container .close-up-img {
    width: 45vw;
    right: -22.5vw;
    bottom: -20vw;
    position: absolute;
}
.baa-container p i {
    font-size: 35px;
    margin-left: 20%;
}
.baa-container > p:last-child {
    width: 50%;
}


/*  */

/*------ Footer ------*/
/* #colophon .site-above-footer-wrap {
    padding: 40px 0 0;
} */

.site-footer-above-section-1 .ast-builder-html-element > div {padding: 0 5vw}
#colophon .site-footer-above-section-1{ margin-bottom: 0}
/* #colophon .site-primary-footer-wrap{ padding-left: 5vw; padding-right: 5vw;} */

.site-above-footer-wrap .stars i {font-size: 27px}
.site-above-footer-wrap .stars i + i {margin-left: 10px}

footer .wpcf7 label {
    display: inline-block;
    width: 100%;
    font-family: 'Zona Pro';
    font-weight: 600;
    text-align: left;
    padding-top: 0 !important;
    padding-bottom: 20px !important;

}
.wpcf7 .flex>div{
    width: 45%;
}
#colophon .wpcf7 input, #colophon .wpcf7 textarea, #colophon .wpcf7 select {
    background-color: white;
    border: none;
    color: var(--dark, black);
    padding: 10px;
    left:0;
}
#colophon .wpcf7 select option {color: #fff;background-color: rgba(127,127,127,1)}
#colophon .wpcf7 input::placeholder, #colophon .wpcf7 textarea::placeholder, #colophon .wpcf7 select::placeholder {color: #272725}

.wpcf7 textarea, .wpcf7 input,  .wpcf7 select{
    border-radius: 12px;
    background: #fff;
    height: 100%;
}
.wpcf7 .flex, .wpcf7 .d-flex {column-gap: 10%}
#colophon input[type=submit] {
    width: auto;
    background-color: var(--golden)!important;
    border-radius: 10px;
    text-transform: capitalize;
    margin-left: auto;
    margin-right: auto;
    display: block;
    font-weight: 600;
    color: var(--black-alt);
    padding: 20px 30px;
}
#colophon span.wpcf7-list-item-label, #colophon span.wpcf7-list-item-label a {color: white}
span.wpcf7-list-item-label a{text-decoration: underline;}
.sm-links a{display: inline-flex}
.sm-links i {
    background-color: #fff;
    width: 35px;
    height: 35px;
    color: #515150;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    font-size: 20px;
    margin-right: 10px;
}

/*------ HomePage ------*/
.home-alt-banner .row {width: 70%}

/*------ Treatments Cards ------*/
.card-swiper > .swiper-wrapper, .alt-card-swiper > .swiper-wrapper {
    box-sizing: border-box;
}
.card-swiper .card {
    padding: 20px 25px;
    width: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
    background: 0 0;
    font-size: 16px;
    align-items: center;
}
.card-swiper .card ul{text-align: left;}
.card-swiper .card:after {
    content: "";
    background: #fff url(https://primeadvanceddentistry.com/wp-content/uploads/Card.jpg);
    background-size: contain;
    display: block;
    position: absolute;
    inset: 0;
    border-radius: 25px;
    z-index: -1;
}
.card-swiper .card.main {
    position: relative;
    top: 0;
    z-index: 10;
    overflow: visible;
    margin-top: 48px;
}
.card-swiper .card.main>div {
    position: absolute;
    top: -50px;
    padding: 10px 0;
    background-color: #000;
    left: 1px;
    right: 1px;
    z-index: -5;
    border-top-left-radius: 25px;
    border-top-right-radius: 25px;
}

/* Splide */
.splide__pagination > li > button.is-active{opacity: 1;}
.splide__pagination > li > button {
    background-color: var(--dark-grey, #010101);
    width: 10px;
    height: 10px;
    font-size: 10px;
    padding: 0;
    margin-top: 10px;
    opacity: 0.5;
    border:none;
}
.splide__pagination > li ~ li {
    padding-left: 10px;
}
.review-swiper .splide__slide {
    height: 100%;
}
.splide .splide__arrow {
    position: absolute;
    font-size: 40px;
    padding: 0;
    z-index: 10;
    top: 40%;
    background-color: unset;
}
button.splide__arrow.splide__arrow--next {right:0}
button.splide__arrow.splide__arrow--prev {left: 0}

/* Auxiliar, deleted after update */
#content .pb2, #colophon .pb2{padding-bottom:20px}
#colophon section {
    padding-top: 80px;
    padding-bottom: 80px;
}
#colophon section > .row{
    padding-left: 6vw;
    padding-right: 6vw;
}
#colophon .uppercase{text-transform: uppercase;}
#colophon .row {
    display: flex;
    flex-wrap: wrap;
}
#colophon .col-12{width:100%}
#colophon .mb2{margin-bottom:20px}
#colophon .mb3{margin-bottom:30px}
#colophon .underline{text-decoration: underline}

#colophon .left-align {text-align: left}

/*Blogs*/
@media (max-width: 544px){
    .ast-single-entry-banner[data-post-type="post"] {min-height: 600px !important;}
	.ast-single-entry-banner[data-post-type="post"][data-banner-background-type="featured"] {background-position: 7% top !important;}
	.ast-single-entry-banner[data-post-type="post"] {justify-content: end !important;}
	.ast-single-entry-banner[data-post-type="post"] .entry-meta, .ast-single-entry-banner[data-post-type="post"] .entry-meta, .ast-single-entry-banner[data-post-type="post"] .entry-meta * {font-size: 0.8rem!important;}
	.entry-content .row {padding-left: 0; padding-right: 0;}
}
/*Fin Blogs*/

@media (min-width: 768px){
    .md-ar-16-9{aspect-ratio: 16/9}
}

@media (min-width: 1024px){

    /*------ fonts ------*/
    #content h1 .alt-1, #content h1.alt-1 {
        font-size: 48px;
        text-transform: capitalize;
    }

    #content h2{
        font-size: 50px;
        line-height: 50px;
    }

    #content h2.alt-1, #content h2 .alt-1, #content .h2-mask.alt-1{
        font-size: 30px;
        line-height: 40px;
    }
    #content h2 .alt-2, #content .h2-mask.alt-2{font-size:20px; line-height:1em;}
    #content h3.alt-1, #content .l-font-20{
        font-size: 20px;
        line-height: 22px;
    }
    #content .h3-mask, #content .l-h3-mask{
        font-size: 25px;
        line-height: 30px;
    }

    #content h3.d-alt-1{
        font-size:20px;
        line-height:1.1em;
    }

    #content h3.l-h2-mask, #content h2.l-original{
        font-size: 50px;
        line-height: 60px;
    }

    .footer-title {
        font-size: 40px;
        line-height: 50px;
        letter-spacing: 1.5px;
    }
    header a.cta-btn {font-weight: 600;}
    a.cta-btn{font-size: 15px;}

    a.cta-btn:hover{
        color: var(--golden)!important;
        background-color: var(--white);
    }

    #content .lg-fs-16, #colophon .lg-fs-16{font-size:16px; line-height: 1.3em}
    #content .lg-fs-18, #colophon .lg-fs-18{font-size:16px; line-height: 1.3em}
    #content .lg-fs-24{font-size: 24px; line-height: 24px}
    #content .lg-fs-32{font-size: 32px}
    #content .lg-fs-30{font-size: 30px; line-height: 30px}
    #content .lg-fs-48{font-size: 48px; line-height: 48px}
    #content .lg-fs-50{font-size: 50px; line-height: 55px}
    #content .lg-fs-64{font-size: 64px; line-height: 64px}

    #content .lg-lh-1em{line-height: 1em}
    #content .lg-lh-1-5em{line-height: 1.5em}

    #content .l-font-70 { font-size: 70%}
    #content .l-font-80 { font-size: 80%}
    #content .l-font-100 { font-size: 100%}
    #content .l-font-130 { font-size: 130%}
    #content .l-font-150 { font-size: 150%}
    #content .d-bold{ font-weight: 700}
    #content .d-semibold {font-weight: 600}
    #content .d-light{ font-weight: 300}
    #content .d-capitalize{ text-transform: capitalize;}
    #content .d-white, #colophon .d-white{ color: var(--white)}
    #content .l-golden, .l-golden{ color: var(--golden)}
    #content .d-inherit{ font-size: inherit; }

    /*------ General ------*/
    #content .lg-white, #colophon .lg-white{color: var(--light, white)}
    #content .lg-bkg-lightgrey-pattern{
        background: linear-gradient(180deg, #F9F9F9 0%, rgba(249, 249, 249, 0.80) 80%, #F9F9F9 100%), url('/wp-content/uploads/bkg-pattern.jpg') repeat;
    }
    #content .lg-bkg-white-pattern{
        background: linear-gradient(180deg, white 0%, rgba(255, 255, 255, 0.80) 80%, white 100%), url('/wp-content/uploads/bkg-pattern.jpg') repeat;
    }
    .lg-bkg-white-to-lightgrey-v{background: linear-gradient(180deg, #FEFEFE 0%, #F1F1F1 100%);}
    .lg-bkg-white-to-grey-h {background: linear-gradient(90deg, rgb(255 255 255 / 5%), rgb(67 66 66 / 40%))}
    #content .lg-bkg-unset{background: none}
    #content .hover-golden:hover{color: var(--accent, gold)}
    #content .hover-golden.underline{text-decoration: underline;}


    #content .width-2-3 {
        max-width: 66.666666666%;
        margin-left: auto;
        margin-right: auto;
    }
    .l-width-50pc, .width-1-2{ width: 50% }
    #content .width-1-3, #content .l-width-1-3{max-width: 33.3333333333%}
    .width-1-4, .l-width-1-4 { max-width: 25%; width: 100%;}
    .width-7-12 { max-width: calc(7 / 12 * 100%); width: 100%;}
    .width-5-12, .l-width-5-12 { max-width: calc(5 / 12 * 100%); width: 100%}
    .width-10-12, .l-width-10-12 { max-width: calc(10 / 12 * 100%); width: 100%}
    
    #content .max-height-700{
        height: 100%;
        max-height: 700px;
        margin-left:auto;
        margin-right: auto;
        width: auto
    }

    .mh-700{max-height: 700px}
    .mh-668{max-height: 668px}
    
    .row.d-flex, .d-flex { display: flex;}
    .d-flex.reverse-flex {flex-direction: row-reverse;}
    .d-flex.d-vertical-center-align{align-items: center;}
    #content .d-text-left, #content .d-text-left h1, #content .d-text-left h2, #content .d-text-left h3,
    #content .d-text-left h4, .d-text-left{ text-align: left;}
     .row{padding:0;}
    .banner-gray-gradient{ background: #5c5c5c; background: linear-gradient(90deg,rgba(92,92,92,1) 0%,rgba(183,183,183,1) 50%)}
    .reviews-background {
        background: #e3e3e3;background: linear-gradient(90deg,rgba(227,227,227,0) 0%,rgba(229,229,229,.43) 48%,rgba(135,135,135,.43) 100%);
    }
    #content .d-align-self-end{align-self: self-end;}
    .d-bottom--20{ bottom: -20% }
    
    .d-left--2{ left: -2%}
    .d-left-0{left:0}
    .d-right-0{right:0}
    
    
    .hide-m { display: block}
    .hide-d{display: none}
    
    .flex.d-justify-left{justify-content: flex-start;}
    .flex.d-column{ flex-direction: column}
    #content .d-overflow-visible{overflow: visible}

    /*------ Header ------*/
    #ast-desktop-header .site-primary-header-wrap {padding: 0 7.5vw}

    /*------ Hero ------*/
    #content #hero, #content main > section:first-child {
        padding-top: 200px;
        background-image: url('/wp-content/uploads/hero-4.jpg');
        padding-right: 0;
    }
    /*------ First Content Treatments ------*/
    .first-content .column:nth-child(2) {display: none}

    #hero:not(.alt-hero)>.row {
        display: grid;
        grid-template-columns: calc(50% - 7.5%) 1fr;
        column-gap: 7.5%;
    }
    

    #hero:not(.alt-hero) .row > .column:first-child{
        padding: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    #hero .hero-slider .swiper-slide, #hero .hero-slider .swiper-slide-duplicate, 
    #hero .hero-slider .splide__slide,
    #content main > section:first-child .splide .splide__slide {transform: none;}
    
    /*------ Banner ------*/
    #content .banner-section.new-contact .absolute {
        width: 50%;
        bottom: unset;
        top: -70px;
    }

    #content .banner-section:not(.new-contact) { padding-left: 0; padding-top: 55px; padding-bottom: 45px}
    #content .banner-section:not(.new-contact) > div:first-child { width: 50%; margin-left: auto; z-index:10; padding-left: 3vw; }
    #content .banner-section:not(.new-contact) > div:last-child {
        width: 50%;
        z-index: 5;
        bottom: 0;
        top: -10%;
        left: 0%;
    }
    #content .banner-section > div.l-bottom--20:last-child{ bottom: -30% }
    .wpcf7 .d-flex>div {width: 45%}
    .wpcf7 form>div, .wpcf7 form>p{margin-bottom:0;}
    .banner-section .wpcf7 input[type=submit]{margin-bottom:0;}
    span.wpcf7-spinner {right: 20%}


    /* two column contact-form */
    .lg-two-column-cf .uacf7-form-2053 {
        flex-wrap: wrap;
        display: inline-flex;
        width: -webkit-fill-available;
        column-gap: 20px;
    }
    .lg-two-column-cf .uacf7-form-2053 > div:not(:last-of-type):not(:nth-child(7)) {width: calc(50% - 10px)}
    .lg-two-column-cf .uacf7-form-2053 > div:nth-child(7), .lg-two-column-cf .uacf7-form-2053 > div:last-of-type {width: 100%}
    .lg-two-column-cf .uacf7-form-2053 > input {margin: 0 auto; background-color: var(--golden, gold)}
    .lg-two-column-cf  input[type="submit"] {margin: 0 auto; background-color: var(--golden, gold)}

    /*------ Paddings and Margins ------*/
    #content .column, #content .lateral-padding{padding-left: 20px; padding-right: 20px;}
    #content .column.d-no-padding, #content .l-no-padding{padding: 0}
    
    #content main > section{padding: 80px 7.5vw 80px}
    #content .row-padding-right{padding-right: 7.5vw}
    #content main > section.no-padding{padding: 0}
    #content main > section.fullwidth{padding-left:0; padding-right: 0;}
    #content .l-padding-top-5pc{padding-top: 5%}
    #content .l-padding-top-150{padding-top: 150px}
    #content .l-padding-top-200{padding-top: 200px}
    #content .l-padding-top-0{padding-top: 0px}
    #content .l-padding-top-130{padding-top: 130px}
    #content .l-padding-bottom-0{padding-bottom: 0px}
    #content .l-padding-bottom-80{padding-bottom: 80px}
    #content .l-padding-bottom-120{padding-bottom: 120px}
    #content .l-padding-bottom-180{padding-bottom: 180px}
    #content .l-vertical-margin-auto{margin-top: auto; margin-bottom: auto}
    #content .l-lateral-margin-auto{margin-left: auto; margin-right: auto}
    #content .l-margin-bottom-0{margin-bottom: 0}
    #content .l-margin-bottom-8{margin-bottom: 8px}
    #content .l-margin-bottom-16{margin-bottom: 16px}
    #content .l-margin-bottom-24, .l-margin-bottom-24{margin-bottom: 24px}
    #content .l-margin-bottom-32, footer#colophon .l-margin-bottom-32{margin-bottom: 32px}
    #content .l-margin-bottom-40, .l-margin-bottom-40{margin-bottom: 40px}
    #content .l-margin-bottom-48{margin-bottom: 48px}
    #content .l-margin-bottom-64{margin-bottom: 64px}
    #content .l-margin-bottom-80{margin-bottom: 80px}
    #content .l-margin-bottom-96{margin-bottom: 96px}

    /*------ Treatments Cards ------*/
    #content .card-swiper{padding-top:95px}
    #content .card-swiper .card.main{top:-90px;}

    /*------ Before and after ------*/
    .baa-container>.flipcard{width: 80%; min-height: 370px;}
    
    .baa-container .close-up-img {
        width: 70%;
        right: -30%;
        bottom: -40px;
    }
    #content .fc-front {
        position: relative;
    }
    #content .fc-front, #content .fc-back{
        top:0;
    }

    /*------ Reviews ------*/
    .review-section{
        grid-template-columns: 33% 25% 42%;
        grid-template-areas: 'picture title review';
    }
    .review-swiper .inner-slide {
        display: grid;
        grid-template-columns: 18% 80%;
        column-gap: 2%;
    }
    .review-swiper .review-content .review-stars {
        justify-content: flex-start;
    }
    .review-swiper .inner-slide .review-content {
        text-align: left;
    }
    .review-swiper .review-stars i + i {
        margin-left: 5px;
    }
    .review-content p:nth-child(3) {
        font-size: 12px;
        line-height: 1.5em;
    }

    /*------ Footer ------*/
    /* #colophon .site-above-footer-wrap{ padding: 120px 0 0;} */
    .site-footer-above-section-1 .ast-builder-html-element > div {padding: 0}
    /* #colophon .site-primary-footer-wrap {padding: 80px 7.5vw} */
    


    /* Auxiliar, delete after update */
    
    #content .lg-flex, #colophon .lg-flex {display: flex;}
    #content .lg-pr1, #colophon .lg-pr1{padding-right:10px}
    #content .lg-pl1, #colophon .lg-pl1{padding-left:10px;}
    .lg-col-6, #colophon .lg-col-6{width: 50%}
    .lg-col-3, #colophon .lg-col-3{width:25%}
    #colophon .lg-ml-auto{margin-left: auto}
    #content .lg-pb0, #colophon .lg-pb0{padding-bottom:0}
    #content .lg-pb2, #colophon .lg-pb2{padding-bottom:20px}
    #content .lg-px2, #colophon .lg-px2{padding-left: 20px; padding-right:20px}
    #colophon section > .row{
        padding-left: 7.5vw;
        padding-right: 7.5vw
    }

    #colophon p{font-size: 16px; line-height: 1.3em}

}

@media (min-width: 1440px){

    #content h2.alt-1, #content h2 .alt-1, #content .h2-mask.alt-1, #content .xl-fs-50{
        font-size: 50px;
        line-height: 55px;
    }
    #content h2{
        font-size: 73px;
        line-height: 60px;
    }
    #content h2 .alt-2, #content h2.alt-2, #content .h2-mask.alt-2{font-size:30px; line-height:1em;}
    #content h3.d-h2-mask, #content h2.d-original{
        font-size: 73px;
        line-height: 70px;
    }
    #content h3.alt-1, #content .d-font-30, #content .xl-fs-30{
        font-size: 30px;
        line-height: 32px;
    }
    #content .d-font-25{font-size: 25px; line-height: 34px;}
    #content .xl-fs-24{font-size: 24px; line-height: 24px}
    /* #content .xl-fs-50{font-size: 50px; line-height: 55px} */

    a.cta-btn {
        font-size: 17px;
    }
    #content .xl-lh-1em{line-height: 1em}

    #content .d-font-60 { font-size: 60%}
    #content .d-font-80 { font-size: 80%}
    #content .d-font-100 { font-size: 100%}
    #content .d-font-130 { font-size: 130%}
    #content .d-font-150 { font-size: 150%}
    #content .d-font-200 { font-size: 200%}
    #content .d-bold{ font-weight: 700}
    #content .d-semibold {font-weight: 600}
    #content .d-light{ font-weight: 300}
    #content .d-capitalize{ text-transform: capitalize;}
    #content .d-white, #colophon .d-white{ color: var(--white)}
    #content .d-golden, .d-golden{ color: var(--golden)}
    #content .d-inherit{ font-size: inherit; }


    /*------ Paddings and Margins ------*/
    #content main > section{padding: 120px 7.5vw 80px}
    #content main > section.no-padding{padding: 0}
    #content main > section.fullwidth{padding-left:0; padding-right: 0;}
    #content .d-padding-top-5pc{padding-top: 5%}
    #content .d-padding-top-200{padding-top: 200px}
    #content .d-padding-top-0{padding-top: 0px}
    #content .d-padding-top-130{padding-top: 130px}
    #content .d-padding-bottom-0{padding-bottom: 0px}
    #content .d-padding-bottom-80{padding-bottom: 80px}
    #content .d-padding-bottom-120{padding-bottom: 120px}
    #content .d-padding-bottom-180{padding-bottom: 180px}
    #content .d-vertical-margin-auto{margin-top: auto; margin-bottom: auto}
    #content .d-lateral-margin-auto, #content .d-margin-left-auto{margin-left: auto}
    #content .d-lateral-margin-auto, #content .d-margin-right-auto{margin-right: auto}
    #content .d-margin-bottom-0{margin-bottom: 0}
    #content .d-margin-bottom-8{margin-bottom: 8px}
    #content .d-margin-bottom-16{margin-bottom: 16px}
    #content .d-margin-bottom-24, .d-margin-bottom-24{margin-bottom: 24px}
    #content .d-margin-bottom-32{margin-bottom: 32px}
    #content .d-margin-bottom-40, .d-margin-bottom-40{margin-bottom: 40px}
    #content .d-margin-bottom-48{margin-bottom: 48px}
    #content .d-margin-bottom-64, .d-margin-bottom-64{margin-bottom: 64px}
    #content .d-margin-bottom-80{margin-bottom: 80px}
    #content .d-margin-bottom-96{margin-bottom: 96px}


    /*------ General ------*/
    #content .d-width-2-3 {
        max-width: 66.666666666%;
        margin-left: auto;
        margin-right: auto;
    }
    .d-width-50pc, #content .d-width-1-2{ width: 50% }
    #content .width-1-3, #content .d-width-1-3{max-width: 33.3333333333%}
    .d-width-1-4 { max-width: 25%; width: 100%;}
    .d-width-10-12 { max-width: calc(10 / 12 * 100%); width: 100%}

    /*------ Banner ------*/
    #content .banner-section:not(.new-contact) { padding-left: 0; padding-top: 80px; padding-bottom: 60px}
    #content .banner-section:not(.new-contact) > div:first-child { width: 50%; margin-left: auto; z-index:10; padding-left: 3vw; }
    #content .banner-section:not(.new-contact) > div:last-child {
        width: 50%;
        z-index: 5;
        bottom: 0;
        top:-10%;
        left: 0%;
    }
    #content .banner-section > div.d-bottom--30:last-child{ bottom: -30% }
    /*------ Hero ------*/
    #hero .hero-slider .swiper-slide>div{padding:0 45px;}
    /*------ Reviews Section ------*/
    .review-content p:nth-child(3) {
        font-size: 15px;
        line-height: 1.2em;
    }

    /*------ First Section Treatments ------*/
    .first-content {
        background-position: top;
        background-repeat: no-repeat;
        background-size: cover;
        background-image: url("https://primeadvanceddentistry.com/wp-content/uploads/gif-background.jpg");
    }
    .first-content .column:nth-child(2) {
        display: block;
    }

    /*------ Cards ------*/
    .card-swiper .card{padding: 30px 40px;}

    /*------ Before and Afters ------*/
    .baa-container .close-up-img {
        width: auto;
        right: -30%;
        bottom: -123px;
    }

    /*------ Footer ------*/
    /* #colophon .site-above-footer-wrap {
        padding: 120px 0 0 7.5vw;
    } */
    footer#colophon .site-footer-above-section-1 .ast-builder-html-element:before{content:unset}
    footer#colophon .site-footer-above-section-1 .ast-builder-html-element > div {width: 47%}
    footer#colophon .site-footer-above-section-1 .ast-builder-html-element > p{width: 53%}
    #colophon .wpcf7 input, #colophon .wpcf7 textarea, #colophon .wpcf7 select {font-size: 20px; padding: 20px; margin-left:0}

    /* Auxiliar, deleted after update */
    #colophon section {
        padding-top: 80px;
        padding-bottom: 80px;
    }
    #colophon h2{font-size:64px; line-height:64px}
    
    
}
 .grecaptcha-badge { 
    visibility: hidden;
} 
@keyframes fadeEffect {
    from {
        opacity:0
    }
    to{
        opacity:1
    }
}

@media (max-width: 544px) {
    .footer-widget-area[data-section="section-fb-html-1"] .ast-builder-html-element {
        color: #434342;
    }
}