@import url("https://use.fontawesome.com/releases/v5.14.0/css/all.css");

body{
    font-family: 'Montserrat', sans-serif;
}

/* Cabeçalho */
header.menu {
    position: fixed;
    top: 0;
    z-index: 100;
    width: 100%;
    transition: .2s All;
}

header.menu.white {
	background-color: #fff;
	box-shadow: 0 2px 5px rgba(0,0,0,.2);
}

header .nav-item {
	text-align: center;
	padding: 10px 0;
	padding: 20px 0;
}

.navbar-light .navbar-nav .nav-link {
    color: #FFF;
    font-weight: 200;
    padding: 0 1rem;
    font-weight: bold;
}

.navbar-light .navbar-nav .nav-link:hover {
    color: #000;
}

.navbar-light .navbar-toggler {
    background-color: #55d9e6 ;
    color: #FFF ;
}
/* */
.social-pill {
    position: fixed;
    right: 30px;
    top: 50%;
    z-index: 1000;
}
.social-pill .title {
    text-align: center;
    background-color: #040B29;
    color: #fff;
    padding: 15px 9px 0;
    border-radius: 50%;
    height: 53px;
    margin-bottom: -15px;
    border: 1px solid #55d9e6;
    text-transform: uppercase;
    font-size: 0.8em;
}
.social-pill .social-links {
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    align-items: center;
    background: #fff;
    border: 1px solid #55d9e6;
    border-radius: 30px;
    padding: 7px;
}
.social-pill .social-links a:first-child{
    margin-bottom: 15px;
}
#home {
    margin-top: 64px;
}
#home::after {
    content: "";
    display: block;
    position: relative;
    width: 100%;
    height: 15em;
    /*background-image: url(../img/bg-webdoor-vector.png);*/
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
    margin-top: -14.3em;
    z-index: 12;
    pointer-events: none
}

@media (max-width: 1024px) {
    #home::after {
        content: "";
        display: block;
        position: relative;
        width: 100%;
        height: 8em;
        background-image: url(../img/bg-webdoor-vector.png);
        background-size: 100% 75%;
        background-position: bottom center;
        background-repeat: no-repeat;
        margin-top: -3.7em;
        z-index: 12;
        pointer-events: none;
    }
    #home {
        margin-top: 22px;
    }
}
@media (max-width: 500px) {
    #home::after {
        content: "";
        display: none;
        position: relative;
        width: 100%;
        height: 8em;
        background-image: none;
        background-size: 100% 75%;
        background-position: bottom center;
        background-repeat: no-repeat;
        margin-top: -3.7em;
        z-index: 12;
        pointer-events: none;
    }
    #home {
        margin-top: 22px;
    }
}

#duvidas::after {
    content: "";
    display: block;
    position: relative;
    width: 100%;
    height: 15em;
    background-image: url(../img/bg-faq-vector.png);
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
    margin-top: -12.5em;
    z-index: 12;
    pointer-events: none
}

.padding-fix{
    padding-bottom: 12em;
}

.news-optin {
    background-image: url(../img/bg-stripes.png);
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
    background-color: #62C31A;
}

.postsrecentes {
    background-image: url(../img/bg-stripes_02.png);
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
    background-color: #55D9E6;
}
.postsrecentes h2{
    color: #000;
    font-weight: bold;
}
.postsrecentes .card-body{
    font-weight: bold;
}

.white-box{
    background-color: #fff;
    border-radius: 25px;
}
.semiwhite-box{
    background-color: #DFF8FA;
    border-radius: 25px;
}
.badge-custom {
    color: #000;
    background-color: #C2DE51;
    padding: 0.5em 1.5em;
    font-size: 1.2rem;
    font-weight: 200;
    line-height: 1;
}

.bg-blue {
    background-color: #00BBCE!important;
}
.bg-lightblue {
    background-color: #55D9E6!important;
}
.bg-whiteblue {
    background-color: #DFF8FA!important;
}
.bg-yellow {
    background-color: #FECA64!important;
}
.bg-lightpurple {
    background-color: #6F99FF!important;
}
.text-lightblue {
    color: #00BBCE!important;
}
.bg-radiallightblue {
    background: rgb(170,247,253), url(../img/bg-zila.png);
    background: -moz-radial-gradient(circle, rgba(170,247,253,1) 0%, rgba(223,248,250,1) 100%);
    background: -webkit-radial-gradient(circle, rgba(170,247,253,1) 0%, rgba(223,248,250,1) 100%);
    background: radial-gradient(circle, rgba(170,247,253,1) 0%, rgba(223,248,250,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#aaf7fd",endColorstr="#dff8fa",GradientType=1);
}
.comofunciona::before{
    content: "";
    display: block;
    width: 414px;
    height: 459px;
    background-image: url(../img/bg-zila.png);
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: auto;
    position: absolute;
    right: 5%;
    bottom: 0;
}
@media (max-width: 1024px) {
    .comofunciona::before{
        background-image: none;
    }
}

@media (max-width: 480px) {
    .comofunciona::before{
        background-image: none;
        width: 0px;
    }
}

.slider-rounded-top {
    border-radius: 25px 25px 0 0;
    margin: 0;
}
.slider-rounded-right {
    border-radius: 0 25px 25px 0;
    margin: 0;
}
.full-rounded {
    border-radius:25px;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    color: #00BBCE;
}
h1 b, h2 b, h3 b, h4 b, h5 b, h6 b,
.h1 b, .h2 b, .h3 b, .h4 b, .h5 b, .h6 b {
    color: #040B29;
}

.product-slider .swiper-pagination-bullet {
	padding: 5px 10px;
    border-radius: 15px;
    line-height: 1.1;
    width: auto;
    height: 30px;
    text-align: center;
    color: #505050;
    opacity: 1;
    background: rgba(0,0,0,0.2);
}
.product-slider .swiper-pagination-bullet:first-child{
    display: none;
}
.product-slider .swiper-pagination-bullet:nth-child(2){
    background-color: #DAF1B3;
    font-weight: bold;
    border: 1px solid #35B5C8;
}
.product-slider .swiper-pagination-bullet:nth-child(3){
    background-color: #1EA8BE;
    font-weight: bold;
    border: 1px solid #35B5C8;
}

.product-slider .swiper-pagination-bullet-active {
	color:#000;
	background: #007aff;
}

/* */
.knowledge-slider .swiper-pagination-bullet {
	background: #55D9E6;
    border: 2px solid #55D9E6;
    width: 1em;
    height: 1em;
}
.knowledge-slider .swiper-pagination-bullet-active {
	background: #000;
}
.knowledge-slider .swiper-button-prev, .knowledge-slider .swiper-container-rtl .swiper-button-next {
    left: -5%;
}
.knowledge-slider .swiper-button-next, .knowledge-slider .swiper-container-rtl .swiper-button-prev {
    right: -5%;
}
.knowledge-slider > .swiper-pagination-bullets {
    bottom: -6.5%!important;
}
.knowledge-slider .swiper-button-next:after, .knowledge-slider .swiper-button-prev:after {
    background-image: url(../img/slider-arrow.png);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    font-size: 0;
    display: block;
    width: 35px;
    height: 58px;
}
.knowledge-slider .swiper-button-next:after {
    transform: rotate(180deg);
}

.knowledge-slider .swiper-slide h3 {
    color: #000;
    font-weight: bold;
}
.knowledge-slider .swiper-slide h3 .alternate {
    color: #fff;
}
.info-box {
    padding: 5px 10px;
    border-radius: 10px;
    margin: 10px 0;
}
/* */

.news-optin .form-control,
#recipe_modal .form-control{
    border: 2px solid #000;
    border-radius: 20px;
    margin-bottom: 1em;
}
/* */

.news-optin [type=button], #recipe_modal [type=button]:not(.close),
.news-optin [type=reset],  #recipe_modal [type=reset],
.news-optin [type=submit],  #recipe_modal [type=submit],
.news-optin button{
    background-color: #00BBCE;
    border: 2px solid #000;
    border-radius: 20px;
    padding: 5px 25px;
    font-weight: bold;
}

.news-optin [type=checkbox],
#recipe_modal [type=checkbox]{
    margin-top: 1em;
}

#accordion .card{
    border: 0;
    border-bottom: 1px solid rgba(0,0,0,0.6);
    background: transparent;
}
#accordion .card-header{
    border: 0;
    background: transparent;
    padding: 0rem 1.25rem;
}
#accordion .card-header .btn-link {
    color: #000;
    font-weight: bold;
    text-decoration: none;
}
#accordion .card-header button {
    position: relative;
    width: 100%;
}
#accordion .card-header button::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f056";
    position: absolute;
    right: 0;
}
#accordion .card-header button.collapsed::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f055";
    position: absolute;
    right: 0;
}
#accordion .card-body {
    padding: 1rem 1rem 1rem 4.8rem;
}

.swiper-container.shop-slider{
    border: 2px solid #35B5C8;
    padding: 2em 0em 1.3em;
    border-radius: 25px;
}

.swiper-shop-button-prev, .swiper-container-rtl .swiper-shop-button-next,
.swiper-shop-button-next, .swiper-container-rtl .swiper-shop-button-prev {
    position: absolute;
    top: 30%;
}

.swiper-shop-button-prev, .swiper-container-rtl .swiper-shop-button-next {
    left: -10%;
}
.swiper-shop-button-next, .swiper-container-rtl .swiper-shop-button-prev {
    right: -10%;
}
.swiper-shop-button-next:after, .swiper-shop-button-prev:after {
    content: "";
    background-image: url(../img/slider-arrow-alt.png);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    font-size: 0;
    display: block;
    width: 35px;
    height: 58px;
}
.swiper-shop-button-next:after {
    transform: rotate(180deg);
}

.contact-form .form-group input,
.contact-form .form-group select,
.contact-form .form-group textarea{
    border: 1px solid #000;
    border-radius: 7px;
}
.contact-form [type=submit] {
    background-color: #00BBCE;
    border: 1px solid #00BBCE;
    border-radius: 8px;
    padding: 0.3rem 3.5rem;
    text-transform: uppercase;
    font-size: 16px;
    color: #fff;
}
.form-wpcf7-ajax-row-fix{
    display: flex;
    align-content: center;
    justify-content: start;
    align-items: stretch;
    flex-flow: row-reverse;
}
.sac {
    /* text-align: right; */
}
.sac-icon {
    display: inline-block;
    width: 4rem;
    text-align: center;
}
.sac-icon svg {
    transform: rotateZ(-20deg);
}
.sac-info a {
    color: #fff;
    display: block;
}
.sac-info a.sac-phone {
    font-size: 2rem;
}
.sac-info {
    display: inline-block;
    width: 15rem;
    text-align: center;
    font-style: italic;
}

/* Blog */
.blog-thumb h1 {
    color: #000;
    font-size: 22px;
}
.blog-thumb .title {
    min-height: 78px;
}
.blog-thumb .image-container {
    max-height: 250px;
    overflow: hidden;
}
.blog-thumb .categories ul,
.blog-single .categories ul {
    list-style: none;
    display: flex;
    margin: 0;
    padding: .5rem 0;
}
.blog-thumb .categories li,
.blog-single .categories li {
    margin: 0 .5rem;
    padding: .5rem 1rem;
    background-color: #C5FAFF;
    color: #00BBCE;
}
.blog-thumb .categories li:first-child{
    margin-left: 0!important;
}
.blog-thumb .btn-link {
    padding: 1rem .5rem;
}

.side-bar ul {
    list-style: url(../img/blog-arrow.png);
    margin: 0;
}
.side-bar li {
    padding: .75rem 0;
    font-size: 16px;
}
.side-bar li a {
    color: #000;
}
.searchform input[type=text] {
    width: 100%;
    background-color: #C5FAFF;
    color: #00BBCE;
    border: 0;
    padding: .5rem .5rem .5rem 3rem;
    position: relative;
}
.searchform > div {
    position: relative;
}
.searchform > div::before {
    content: "\f002";
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    left: 0.6rem;
    padding: .5rem;
    z-index: 1;
}
.searchform input[type=submit] {
    display: none;
}
.btn-post-navigation{
    border: 2px solid #000;
    border-radius: 50%;
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: stretch;
    width: 60px;
    height: 60px;
}
.btn-post-navigation.btn-prev a {
    padding: 4px 4px 4px 0;
    color: #000;
}
.btn-post-navigation.btn-next a {
    padding: 4px 0px 4px 4px;
    color: #000;
}
.container-pagination {
    padding-top: 1rem;
    padding-bottom: 4rem;
}
.container-pagination .nav-links span,
.container-pagination .nav-links a {
    display: inline-block;
    width: 2em;
    height: 2em;
    padding: 0.32rem 1rem;
    margin: 0 1.5rem;
    background-color: #fff;
    border: 1px solid #000;
    border-radius: 50%;
    text-align: center;
    font-size: 1.5em;
    text-decoration: none;
    font-weight: bold;
    color: #000;
    opacity: .3;
    
    transition: all .2s;
}
.container-pagination .nav-links a.prev,
.container-pagination .nav-links a.next {
    border: 1px solid #fff;
}
.container-pagination .nav-links span {
    background-color: #fff;
    border: 1px solid #000;
    color: #000;
    opacity: 1;
}
.container-pagination .nav-links a:hover,
.container-pagination .nav-links a:active,
.container-pagination .nav-links a:focus {
    background-color: #fff;
    border: 1px solid #000;
    color: #000;
    opacity: 1;
}
.container-pagination .nav-links a.prev:hover,
.container-pagination .nav-links a.prev:active,
.container-pagination .nav-links a.prev:focus,
.container-pagination .nav-links a.next:hover,
.container-pagination .nav-links a.next:active,
.container-pagination .nav-links a.next:focus {
    background-color: #fff;
    border: 1px solid #fff;
    color: #000;
    opacity: 1;
}
.container-pagination .nav-links span:first-child,
.container-pagination .nav-links a:first-child {
    margin-left: 0em;
}
.swiper-container {
    overflow: hidden;
}
#saibamais .swiper-container {
    overflow: visible;
}

.img-effect-1{
    position: relative;
    left: -4em;
}
.img-effect-2{
    width: 100%;
    transform: scale(1.2);
}
.img-effect-3{
    position: relative;
    right: 0;
}
.play-icon {
    position: absolute;
    z-index: 10;
    top: -28px;
    left: calc(50% - 56px);
    opacity: 0.5;
    color: #fff;
}

@media (max-width: 500px) {
    .play-icon {
        left: calc(50% - 32px);
    }
    .slider-rounded-right {
        border-radius: 0 0 25px 25px;
        margin: 0;
    }
    .img-effect-1{
        position: relative;
        left: -0;
    }
    .img-effect-2{
        width: 100%;
        transform: scale(.8);
    }
    .img-effect-3{
        position: initial;
        right: initial;
    }
    
    #duvidas::after {
        content: "";
        display: none;
        position: relative;
        width: 100%;
        height: 15em;
        background-image: url(../img/bg-faq-vector.png);
        background-size: cover;
        background-position: top center;
        background-repeat: no-repeat;
        margin-top: -12.5em;
        z-index: 12;
        pointer-events: none
    }

    .padding-fix{
        padding-bottom: 1em;
    }

    h1, .h1 {
        font-size: 1.5rem;
    }
    h2, .h2 {
        font-size: 1.2rem;
    }

    .treatment-container div {
        margin-bottom: 2em;
    }
    .treatment-container div:after {
        content: "\f107";
        display: inline-block;
        font-style: normal;
        font-variant: normal;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        color: #00bbce;
        position: absolute;
        left: calc( 50% - 5px );
        bottom: -1.5em;
    }
    .treatment-container div:last-child:after {
        display: none;
    }
    .bg-whiteblue {
        overflow: hidden;
    }
    .knowledge-slider > .swiper-pagination-bullets {
        bottom: -2.9%!important;
    }
}