/*
  Theme Name: Rapid
  Theme URL: https://bootstrapmade.com/rapid-multipurpose-bootstrap-business-template/
  Author: BootstrapMade.com
  License: https://bootstrapmade.com/license/
*/

/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/

body {
  background: #fff;
  color: #9E9E9E;
  font-family: "Rubik", sans-serif;
  font-size: 14px;
  /* letter-spacing: 0.035rem; */
}

a {
  color: #E2A69A;
  transition: 0.5s;
}

a:hover,
a:active,
a:focus {
  color: white;
  outline: none;
  text-decoration: none;
}

.default-color{
  color: #292F4B;
}

p {
  padding: 0;
  margin: 0 0 30px 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Rubik", sans-serif;
  font-weight: 400;
  margin: 0 0 20px 0;
  padding: 0;
}

/* Back to top button */

.back-to-top {
  position: fixed;
  display: none;
  background: #09B6CD;
  color: #fff;
  width: 44px;
  height: 44px;
  text-align: center;
  line-height: 1;
  font-size: 16px;
  border-radius: 50%;
  right: 15px;
  bottom: 15px;
  transition: background 0.5s;
  z-index: 11;
}

.back-to-top i {
  padding-top: 12px;
  color: #fff;
}

#cta-homepage{
  margin-top: 100px;
}

#cta-homepage .background-special{
  min-height: 618px;
  background: #F7F7F7;
  display: flex;
  margin-left: 100px;
  margin-right: 60px;
}

#cta-homepage .content-text{
  margin-top: 24px;
  margin-bottom: 24px;
  font-size: 14px;
  color: #292F4B;
  margin-right: 80px;
  /* text-align: justify; */
}

#cta-homepage .image-dark{
  background-image: url(../img/update/quem-somos/finland.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
height: 450px;
  width: 100%;
  position: absolute;
  top: 0;
  left: -40px;
  border-radius: 6px;
}

#quotes{
  padding-top: 100px;
  padding-bottom: 150px;
  background: #F7F7F7;
}

#quotes .box{
  max-width: 740px;
}

#quotes .quote-text{
  color: #09B6CD; 
  font-size: 30px; 
  font-weight: 300;
}

.quote-image-left{
  position: absolute;
  left: -60px;
  width: 50px;
  height: 50px;
  top: -25px;
  /* background: #065e77; */
  background: url(../img/update/quote.svg) center no-repeat;
}

#quotes .quote-image-right{
  position: absolute;
  right: -60px;
  width: 50px;
  height: 50px;
  bottom: -25px;
  /* background: #065e77; */
  background: url(../img/update/quote-2.svg) center no-repeat;
}

.new-button-blue-with-arrow{
  font-family: "Rubik", sans-serif;
  font-size: 14px !important;
  border-radius: 6px;
  display: flex !important;
  font-weight: 400!important;
  text-align: center;
  transition: 0.3s;
  background: #09B6CD;
  color: white !important;
  border: 1px solid transparent;
  line-height: 40px !important;
  align-items: center;
  justify-content: space-between;
  padding: 0 16px;
  
}

.new-button-blue-with-arrow:hover{
  display: inline-block;
  cursor: pointer;
  text-align: center;
  transition: 0.5s;
  border: 1px solid #09B6CD;
  color: #09B6CD !important;
  box-shadow: inset 0 -3.25em 0 0 #F7F7F7;
  box-shadow: inset 0 -6.5em #F7F7F7, inset 0 -6.5em #F7F7F7;
}

 

/* Prelaoder */

#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  overflow: hidden;
  background: #fff;
}

.testemunho-title{
  font-size: 18px;
  font-weight: 500;
  color: #292F4B;
}

.testemunho-sub-title{
  font-size: 12px;
  color: #292F4B;
}

.owl-item{
  height: 304px;
  width: 100%;
  /* background: #FDF2B3; */
  border-radius: 30px;
}

.owl-item::before {
  content: '';
  position: absolute;
  display: block;
  width: 93%;
  z-index: 1;
  top: 20px;
  left: 45px;
  height: 280px;
  border-radius: 30px;
  background: #ABDBAE;
}

a, a > span {
  position: relative;
  color: inherit;
  text-decoration: none;
  /* line-height: 24px; */
}

.hoverBold:before {
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 2px;
  background: white;
  transform: scaleX(0);
}

a:before, a:after, a > span:before, a > span:after {
  content: '';
  position: absolute;
  transition: transform .5s ease;
}

.hoverBold:hover:before {
  transform: scaleX(1);
}

.pedirBabyBoxMobile{
  position: absolute;
  width: 100%;
  height: 45px;
  background: #292F4B;
  bottom: 0;
  text-align: left;
  line-height: 45px;
  color: white;
  font-weight: 400;
  padding: 0 16px!important;
  font-size: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}



#obterBabyBox{
  height: 677px;
  background-image: url(../img/Wave.svg);
  background-repeat: no-repeat;
  background-size: cover;
}

#obterBabyBox .box{
  display: flex;
  justify-content: space-around;
  align-content: center;
  align-items: center;
  margin-top: 50px;
}

#obterBabyBox .box .step{
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-content: center;
  align-items: center;
}

#obterBabyBox .box .step.one .img{
  background: url(../img/update/como-obter/1.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  width: 240px;
  height: 220px;
}

#obterBabyBox .box .step.two .img{
  background: url(../img/update/como-obter/2.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  width: 251px;
  height: 220px;
}


#obterBabyBox .box .step.three .img{
  background: url(../img/update/como-obter/3.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  width: 240px;
  height: 220px;
}

#obterBabyBox .box .step .text{
  text-align: center!important;
  margin-top: 24px!important;
  font-size: 23px!important;
  color: white!important;
}


.obterBabyBox .passosText{
  color: #9E9E9E; 
  font-size: 14px; 
  font-weight: normal
}

#obterBabyBox .title{
  font-size: 40px;
  text-align: center;
  width: 100%;
  color: #292F4B;
  font-weight: 400;
}

.obterBabyBox .passosTitle{
  color: #E2A69A; 
  font-size: 18px; 
  font-weight: 500
}

.hide{
  display: none;
}

.requisitos .options{
  position: absolute;bottom: -200px;width: 100%;background:white;border: 1px solid#E7E7E7; padding: 10px 0; z-index: 99999;
}

#caixa-escolhida {
  border: 1px solid #E3E3E3 !important;
  height: 88px;
  display: flex;
  align-items: center;
}

.cb1 .caixa-imagem{
  background: url(../img/modelo-1.png) center no-repeat!important;
  background-size: cover!important;
}

.cb2 .caixa-imagem{
  background: url(../img/modelo-2.png) center no-repeat!important;
  background-size: cover!important;
}

.cb3 .caixa-imagem{
  background: url(../img/modelo-3.png) center no-repeat!important;
  background-size: cover!important;
}

.small-text{
  font-size: 14px;
  color: #292F4B;
}

.small-text-title{
  color: #9E9E9E;font-size: 12px;
}

.flex-fix{
  display: flex;flex-direction: column;justify-content: center;
}

.options .caixa-imagem, .segundo .caixa-imagem{
  min-width: 50px;height: 50px;border-radius: 50%;
  background: url(../img/modelo-1.png) center no-repeat;
  background-size: cover !important;
  margin-right: 16px;margin-left: 16px;
}

/* .new-image{
  background: url(../img/modelo-1.png) center no-repeat;
  background-size: cover !important;
} */

.requisitos:hover{
  cursor: pointer;
}

.options:hover{
  cursor: pointer;
}
 

.botaoBabyBoxNav{
  font-family: "Rubik", sans-serif;
  font-size: 14px !important;
  border-radius: 6px;
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  font-weight: 400!important;
  text-align: center;
  transition: 0.3s;
  background: #292F4B;
  color: white !important;
  border: 1px solid transparent;
  line-height: 40px !important;
  padding: 0 16px;
}

.botaoBabyBoxNav:hover{
  display: inline-block;
  transition: 0.5s;
  border: 1px solid #292F4B;
  color: #292F4B !important;
  box-shadow: inset 0 -3.25em 0 0 white;
  box-shadow: inset 0 -6.5em white, inset 0 -6.5em white;
}

#beneficios .img-nuvem, #services .img-nuvem, #faq .img-nuvem {
  background: url(../img/stuff/nuvem_faqs.svg);
  width: 120px;
  height: 70px;
  background-repeat: no-repeat;
  background-position: center;
  display: inline-block;
  margin-top: 80px;
}

#preloader:before {
  content: "";
  position: fixed;
  top: calc(50% - 20px);
  left: calc(50% - 20px);
  border: 2px solid #f2f2f2;
  border-top: 2px solid #1bb1dc;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  -webkit-animation: animate-preloader 1s linear infinite;
  animation: animate-preloader 1s linear infinite;
}

@font-face {
  font-family: 'icons-babybox';
  src: url('../fonts/icons/icons-babybox.eot?65772577');
  src: url('../fonts/icons/icons-babybox.eot?65772577#iefix') format('embedded-opentype'),
       url('../fonts/icons/icons-babybox.woff2?65772577') format('woff2'),
       url('../fonts/icons/icons-babybox.woff?65772577') format('woff'),
       url('../fonts/icons/icons-babybox.ttf?65772577') format('truetype'),
       url('../fonts/icons/icons-babybox.svg?65772577#icons-babybox') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'icons-babybox';
    src: url('../font/icons-babybox.svg?65772577#icons-babybox') format('svg');
  }
}
*/
 
 [class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "icons-babybox";
  font-style: normal;
  font-weight: normal;
  speak: none;
 
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */
 
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
 
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
 
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;
 
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
 
  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
 
.icon-icons-babybox-arrow_forward:before { content: '\e800'; } /* '' */
.icon-icons-babybox-check_box_outline_blank:before { content: '\e801'; } /* '' */
.icon-icons-babybox-check_box:before { content: '\e802'; } /* '' */
.icon-icons-babybox-expand_less:before { content: '\e803'; } /* '' */
.icon-icons-babybox-expand_more:before { content: '\e804'; } /* '' */
.icon-icons-babyboxadd:before { content: '\e805'; } /* '' */
.icon-icons-babyboxdelivery:before { content: '\e806'; } /* '' */
.icon-icons-babyboxdo_not_bleach:before { content: '\e807'; } /* '' */
.icon-icons-babyboxdo_not_tumble-dry:before { content: '\e808'; } /* '' */
.icon-icons-babyboxremove:before { content: '\e809'; } /* '' */
.icon-icons-babyboxshare:before { content: '\e80a'; } /* '' */

@font-face {
  font-family: baby-font;
  src: url(../fonts/PORKH___.TTF);
}

@font-face {
  font-family: baby-font-regular;
  src: url(../fonts/porkys.regular.ttf);
}

.obterBabyBox{
  background: url(../img/stuff/img_obterbabybox.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position:center;
  height: 500px;
}

.baby_font{
  font-family: "baby-font", sans-serif!important;
}

.baby_font_regular{
  font-family: "baby-font-regular", sans-serif!important;
}

@-webkit-keyframes animate-preloader {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes animate-preloader {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

/*--------------------------------------------------------------
# Top Bar
--------------------------------------------------------------*/

#topbar {
  padding: 0 0 10px 0;
  font-size: 14px;
  transition: all 0.5s;
}

#topbar .social-links {
  text-align: right;
}

#topbar .social-links a {
  color: #E2A69A;
  padding: 4px 12px;
  display: inline-block;
  line-height: 1px;
}

#topbar .social-links a:hover {
  color: #ABDBAE;
}

#topbar .social-links a:first-child {
  border-left: 0;
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/

#header {
  padding: 15px 0;
  background-color: #fff;
  z-index: 997;
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
}

#header.header-scrolled,
#header.header-pages {
  /* height: 70px; */
  /* padding: 20px 0; */
  /* background-color: #fff; */
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.3);
}

#header.header-scrolled #topbar,
#header.header-pages #topbar {
  display: none;
}

#header .logo h1 {
  font-size: 36px;
  margin: 0;
  padding: 0;
  line-height: 1;
  font-weight: 400;
  letter-spacing: 3px;
  text-transform: uppercase;
}

#header .logo h1 a,
#header .logo h1 a:hover {
  color: #413e66;
  text-decoration: none;
}

#header .logo img {
  padding: 0;
  height: 50px;
}

.alerta{
  text-align: left;
}

.alerta .mini-title{
  font-size: 14px;
  color: #09B6CD;
  margin-bottom: 8px;
  font-weight: 500;
}

.alerta .black-normal{
  font-size: 14px;
  color: #292F4B;
  margin-bottom: 4px;
}

.alerta .price-box{
  margin-bottom: 24px;
  display: flex;
}

.alerta .price-box .price{
  font-size: 14px;
  color: #292F4B;
  font-weight: 500;
  margin-right: 8px;
}

.alerta .price-box .original-price{
  font-size: 14px;
  font-weight: 500;
  color: #9E9E9E;
  text-decoration: line-through;
}


.main-pages {
  margin-top: 60px;
}

.babybox-page {
  margin-top: 180px;
}

#main .text{
  font-size: 14px!important;
  color:#9E9E9E!important;
  text-align: left!important;
}

#main .title{
  color:#292F4B!important;
  font-size: 35px;
  margin-bottom: 20px!important;
}

#main .image{
  background: url(../img/update/quem-somos/finland.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 100%;
  min-height: 430px;
}

.baby-parceiros-image{
  background: url(../img/update/baby_parc.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 100%;
  min-height: 430px;
}


/*--------------------------------------------------------------
# NOVOS INPUTS
--------------------------------------------------------------*/

/* form starting stylings ------------------------------- */
.group 			  { 
  position:relative; 
  margin-bottom:34px; 
}

.group .grey{
  background:#F7F7F7!important;
}

.new-select{
  position: relative;
}

.group .select-text{
	appearance: none;
  -webkit-appearance:none;
  outline: none;
  background: transparent;
}

.group.select:after {
	position: absolute;
	top: 24px;
	right: 10px;
	/* Styling the down arrow */
	width: 0;
	height: 0;
	padding: 0;
	content: '';
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid #9E9E9E;
	pointer-events: none;
}

select{
 line-height: 33px;
}

input, select, textarea {
  font-size:14px;
  padding:10px 10px 10px 16px;
  display:block;
  border:1px solid #9E9E9E;
  border-radius: 6px;
  min-height: 55px;
  color: #292F4B;
  width: 100%;
  box-shadow: none;
  -webkit-appearance: none;
  font-size:16px;
}

input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px white inset;
}

input[type="date"], input[type="datetime-local"], input[type="month"], input[type="time"]{
  color: transparent;
}

input[type="date"]:focus, input[type="date"]:valid, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="time"]:focus{
  color: #292F4B;
}


.meio{
  width: 100%;
  /* margin-right: 8px; */
}
input:focus 		{ outline:none; }


/* LABEL ======================================= */
.label 				 {
  color:#999; 
  font-size:12px;
  font-weight:normal;
  position:absolute;
  pointer-events:none;
  left:16px;
  top:18px;
  transition:0.2s ease all; 
  -moz-transition:0.2s ease all; 
  -webkit-transition:0.2s ease all;
}

/* active state */
#parceiros input:focus ~ .label, #parceiros input:valid ~ .label, #parceiros .select-text:focus ~ .label, #parceiros .select-text:valid ~ .label, #parceiros textarea:focus ~ .label, #parceiros textarea:valid ~ .label {
  background: #ABDBAE!important
}
input:focus ~ .label, input:valid ~ .label, .select-text:focus ~ .label, .select-text:valid ~ .label, textarea:focus ~ .label, textarea:valid ~ .label {
  top:-9px;
  font-size:12px;
  color: #9E9E9E;
  background: white;
  padding: 0 4px;
  left: 12px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

/* input:invalid ~ label{
  color: transparent;
} */

input[type="text"]:not(:placeholder-shown), input[type="email"]:not(:placeholder-shown), textarea:not(:placeholder-shown) {
  border-color: #E60909;
}

input[type="text"]:not(:placeholder-shown) ~ .label, input[type="email"]:not(:placeholder-shown) ~ .label, textarea:not(:placeholder-shown) ~ .label{
  top:-9px;
  font-size:12px;
  color: #E60909;
  background: white;
  padding: 0 4px;
  left: 12px;
  /* ADICIONA POR CAUSA DOS FAQS */
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
} 

input[type="text"]:not(:placeholder-shown) ~ .error, input[type="email"]:not(:placeholder-shown) ~ .error, textarea:not(:placeholder-shown) ~ .error{
  visibility: visible;
}


input:valid ~ .label, .select-text:valid ~ .label, textarea:valid ~ .label{
  color: #292F4B!important;
}

input:valid, .select-text:valid, textarea:valid{
  border-color: #292F4B!important;
}

input:valid ~ .error{
  visibility: hidden!important;
}

select:valid ~ .error {
  visibility: hidden !important;
}

textarea:valid ~ .error {
  visibility: hidden !important;
}

.group .error{
  font-size: 10px;
  color: #E60909;
  visibility: hidden;
  position: absolute;
  bottom: -19px;
}

/* BOTTOM BARS ================================= */
.bar 	{ position:relative; display:block; width:100%; }
.bar:before, .bar:after 	{
  content:'';
  height:2px; 
  width:0;
  bottom:1px; 
  position:absolute;
  background:#292F4B; 
  transition:0.2s ease all; 
  -moz-transition:0.2s ease all; 
  -webkit-transition:0.2s ease all;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
}

.bar:before {
  left:50%;
}
.bar:after {
  right:50%; 
}

/* active state */
input:focus ~ .bar:before, input:focus ~ .bar:after {
  width:50%;
}

/* HIGHLIGHTER ================================== */
.highlight {
  position:absolute;
  height:60%; 
  width:100px; 
  top:25%; 
  left:0;
  pointer-events:none;
  opacity:0.5;
}

/* active state */
input:focus ~ .highlight {
  -webkit-animation:inputHighlighter 0.3s ease;
  -moz-animation:inputHighlighter 0.3s ease;
  animation:inputHighlighter 0.3s ease;
}

/* ANIMATIONS ================ */
/* @-webkit-keyframes inputHighlighter {
	from { background:#5264AE; }
  to 	{ width:0; background:transparent; }
}
@-moz-keyframes inputHighlighter {
	from { background:#5264AE; }
  to 	{ width:0; background:transparent; }
}
@keyframes inputHighlighter {
	from { background:#5264AE; }
  to 	{ width:0; background:transparent; }
} */

/*--------------------------------------------------------------
# Intro Section
--------------------------------------------------------------*/

#intro {
  width: 100%;
  height: 100vh;
  position: relative;
  background: #292F4B url("../img/update/quem-somos/bg-estrelas-small.svg") center no-repeat;
  background-size: cover;
}


#intro .image{
  background: url(../img/update/quem-somos/veronica.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 100%;
}

.right-side-content {
  display: flex;
  justify-content: center;
  flex-direction: column;
}
 

.fix-height{
  height: calc(100% - (80px));
  margin-top: 80px!important;
}

.flex-center{
  display: flex;
  align-items: center;
  justify-content: center;
  align-content: center;
}

#intro .right-side-content .page{
  font-weight: 400;
  color: #09B6CD;
  font-size: 16px;
}

#homepage{
  width: 100%;
  height: 100vh;
  position: relative;
  background: #f5f8fd url("../img/bg_estrelas.svg") center no-repeat;
  background-size: cover;
}


#intro .right-side-content .title{
  font-size: 40px;
  color: white;
  line-height: 40px;
  margin: 12px 0px 24px 0;
  font-weight: 500;
}

#intro .right-side-content .text{
  font-size: 14px!important;
  color: #E3E3E3;
  text-align: left!important;
  font-weight: 400;
}

#stepbystep {
  width: 100%;
  height: 80px;
  background: white;
  position: fixed;
  top: 80px;
  z-index: 9999;
  border-top: 1px solid #E3E3E3;
  box-shadow: 0px 1px 3px #00000029;
}

#comprar{
  padding-top: 50px;
}

#dadosMaePai{
  padding-top: 50px;
  padding-bottom: 50px;
}

#sucesso{
  height: 100%
}

ul {
  list-style-type: none;
}

input[type="checkbox"][name^="padrao"] {
  display: none;
}

textarea {
  resize: none;
}

#pedirBabyBoxGratis{
  min-height: 400px;
  background-image: url(../img/footer.svg);
  background-position: center;
  background-size:cover;
  width: 100%;
}

label.escolher-caixa {
  /* margin-right: 16px!important; */
  /* color: #E2A69A;   */
  margin: 0;
  /* padding: 10px; */
  /* border-radius: 50%; */
  /* display: block; */
  /* position: relative; */
  /* margin: 10px; */
  cursor: pointer;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.modal{
  padding: 0!important;
  max-width: calc(100% - 15px);
}

.modal-confirm {		
  color: #636363;
  width: 325px;
}
.modal-confirm .modal-content {
  padding: 20px;
  border-radius: 5px;
  border: none;
}
.modal-confirm .modal-header {
  border-bottom: none;   
      position: relative;
}
.modal-confirm h4 {
  text-align: center;
  font-size: 26px;
  margin: 30px 0 -15px;
}
.modal-confirm .form-control, .modal-confirm .btn {
  min-height: 40px;
  border-radius: 3px; 
}
.modal-confirm .close {
      position: absolute;
  top: -5px;
  right: -5px;
}	
.modal-confirm .modal-footer {
  border: none;
  text-align: center;
  border-radius: 5px;
  font-size: 13px;
}	
.modal-confirm .icon-box {
  margin: 0 auto;
  z-index: 9;
  background: url(../img/stuff/nuvem_faqs.svg);
  width: 100%;
  height: 70px;
  background-repeat: no-repeat;
  background-position: center;
  display: inline-block;
}
.modal-confirm .icon-box i {
  font-size: 58px;
  position: relative;
  top: 3px;
}
.modal-confirm.modal-dialog {
  display: flex;
  align-items: center;
  height: 100%;
  margin: 0 auto;
}
  .modal-confirm .btn {
      color: #fff;
      border-radius: 4px;
  background: #292F4B;
  text-decoration: none;
  transition: all 0.4s;
      line-height: normal;
      border: none;
  }
.modal-confirm .btn:hover, .modal-confirm .btn:focus {
  background: #292F4B;
  outline: none;
}

.mobile-nav-active .fa.fa-times{
  margin: 12px 12px 0 0!important;
}

.fa-arrow-right::before{
  content: "\eaa4";
  font-size: 18px;
}

.fa-remove::before, .fa-close::before, .fa-times::before{
  content: "\eaa6";
  font-size: 48px;
}

.fa-times.small-font::before{
  font-size: 18px;
}

.botao{
  display: flex;
  justify-content: space-between;
  align-content: center;
  align-items: center;
}

.botao a{
  text-align: left;
}

.button-outline-new{
  width: auto;
  border: 1px solid #292F4B;
  color: #292F4B!important;
  font-size: 14px;
  text-align: center;
  min-width: 50%;
  border-radius: 19px;
  line-height: 39px;
  height: 39px;
}

.button-outline-new:hover{
  border: 1px solid #292F4B;
  color: white!important;
  background: #292F4B;
}

.button-normal-new{
  width: auto;
  border: 1px solid #292F4B;
  color: white;
  background: #292F4B;
  font-size: 14px;
  text-align: center;
  min-width: 50%;
  border-radius: 19px;
  line-height: 39px;
  height: 39px;
}

.button-normal-new:hover{
  border: 1px solid #292F4B;
  color: #292F4B!important;
  background: white;
}

/* Eu */

.form-control::placeholder{
  color: #E3E3E3!important;
}

.form-control{
  border: 1px solid #E3E3E3!important;
  border-radius: 12px!important;
}

.form-control:focus{
  border-color: #E2A69A!important;
  box-shadow: none!important;
}

.font_light{
  font-weight: 300;
  font-size: 14px;
  color: #616161;
}

.preto{
  color: #292F4B;
}

label img {
  height: 74px;
  width: 74px;
  transition-duration: 0.2s;
  border-radius: 50%;
  border: 1px solid #E3E3E3;
}

.box-total-price .box-top-price{
  padding: 14px 0 ;
  box-sizing: border-box;
  border-top: 1px solid #E3E3E3;
  border-bottom: 1px solid #E3E3E3;
}

.box-total-price .box-top-price .linha{
  display: flex;
  justify-content: space-between;
}

.box-total-price .price-copy{
  font-size: 14px;
  color: #292F4B;
}

.box-total-price .price-eur{
  font-size: 14px;
  color: #9E9E9E;
}

.box-total-price .box-total{
  display: flex;
  justify-content: space-between;
  padding-top: 8px;
}

.box-total-price .box-total .total-copy{
  color: #292F4B;
  font-size: 14px;
}

.box-total-price .total-eur{
  font-size: 16px;
  color: #292F4B;
  font-weight: 500
}

.ideiaintro{
  background: white!important;
}

/* :checked+label {
  border-color: #ABDBAE;
} */

/* :checked+label::before {
  content: "✓";
  background-color: grey;
  transform: scale(1);
} */

:checked+label img {
  z-index: -1;
  border: 1px solid #292F4B;
}

#intro .intro-info h2 {
  color: #413e66;
  margin-bottom: 40px;
  font-size: 48px;
  font-weight: 700;
}

#intro .intro-info h2 span {
  color: #1bb1dc;
}

#enviar-duvidas{
  position: relative;
}

#intro .intro-info .btn-get-started,
#intro .intro-info .btn-services {
  font-family: "Rubik", sans-serif;
  font-size: 13px;
  border-radius: 6px;
  font-weight: normal;
  display: inline-block;
  padding:10px;
  text-align: center;
  transition: 0.3s;
  color: #fff;
  background: #E2A69A;
  color: #fff;
}

.apply-color{
  padding-left: 26px;
  padding-top: 12px;
}

.apply-color p{
  color: #616161;
  font-size: 14px;
  padding-top: 4px;
}

a:not([href]):not([tabindex]){
  /* color: #e2a69a!important; */
  color: white;
  cursor: pointer;
}

.href a:not([href]):not([tabindex]):first-child{
  color: #ABDBAE;
  cursor: pointer;
}

.href a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover:first-child{
  color: #292F4B;
  cursor: pointer;
}

a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover{
  color: #292F4B;
  cursor: pointer;
}

.btn-services {
  font-family: "Rubik", sans-serif;
  font-size: 14px;
  border-radius: 6px;
  width: 194px;
  font-weight: normal;
  display: inline-block;
  font-weight: 400;
  padding:9px;
  text-align: center;
  transition: 0.3s;
  background: #292F4B;
  color: white;
  border: 1px solid #292F4B;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.hover_me:hover{
  color: #292F4B;
}

.botaoPedirBabyBoxLaranjaParaBranco {
  font-family: "Rubik", sans-serif;
  font-size: 14px;
  border-radius: 6px;
  display: inline-block;
  font-weight: 400!important;
  padding:10px;
  text-align: left;
  transition: 0.5s;
  background: #292F4B;
  color: white;
  border: 1px solid #292F4B;
  display: flex;
  align-items: center;
  justify-content: space-between;
}


.botaoPedirBabyBoxLaranjaParaBranco:hover {
  background: transparent;
  color: #292F4B;
  transition: 0.5s;
  box-shadow:
  inset 0 -6.5em transparent,
  inset 0 -6.5em transparent; 
}

.m310{
  max-width: 310px;
}

.m340{
  max-width: 340px;
}

#what-motivated-us{
  background: #F7F7F7;
}

.btn-new-color {
  width: 200px;
  font-family: "Rubik", sans-serif;
  display: inline-block;
  font-weight: 500;
  padding:10px;
  text-align: center;
  transition: 0.3s;
  border-radius: 6px;
  background: #FDF2B3;
  color: #292F4B;
  border: 1px solid #FDF2B3;
  font-size: 16px;
}

.btn-new-color:hover{
  background: transparent;
  color: #FDF2B3;
  transition: 0.3s;
  box-shadow:
  inset 0 -6.5em transparent,
  inset 0 -6.5em transparent; 
}

.flex-center{
  display: flex;
}

.box-homepage-colorir{
background-image: url('../img/pintar/persp.png');background-position: center;background-size: cover;background-repeat: no-repeat;width: 100%;height: 270px; margin-bottom: 16px;
border: 1px solid #E3E3E3;
}

.box-homepage-aviao{
  background-image: url('../img/aviao/persp.png');background-position: center;background-size: cover;background-repeat: no-repeat;width: 100%;height: 270px; margin-bottom: 16px;
  border: 1px solid #E3E3E3;
}

.box-homepage-elefante{
  background-image: url('../img/elefante/persp.png');background-position: center;background-size: cover;background-repeat: no-repeat;width: 100%;height: 270px; margin-bottom: 16px;
  border: 1px solid #E3E3E3;
}


.colorir-logo{
background-image: url('../img/update/pedir-babybox/color.svg');background-position: center;background-size: contain;background-repeat: no-repeat;height: 60px; margin-bottom: 16px;width: 100%;
}

.aviao-logo{
background-image: url('../img/update/pedir-babybox/aviao.svg');background-position: center;background-size: contain;background-repeat: no-repeat;height: 60px; margin-bottom: 16px;width: 100%;
}

.elefante-logo{
background-image: url('../img/update/pedir-babybox/ele.svg');background-position: center;background-size: contain;background-repeat: no-repeat;height: 60px; margin-bottom: 16px;width: 100%;
}

.btn-verde {
  font-family: "Rubik", sans-serif;
  font-size: 13px;
  border-radius: 19px;
  display: inline-block;
  font-weight: 500;
  padding:10px;
  text-align: center;
  transition: 0.3s;
  background: #ABDBAE;
  color: white;
  border: 1px solid #ABDBAE;
}

.btn-verde:hover {
  display: inline-block;
  padding:10px;
  text-align: center;
  transition: 0.3s;
  color: #ABDBAE;
  background: transparent;
  /* box-shadow: inset 0 -3.25em 0 0 #ABDBAE; */
  box-shadow:
  inset 0 -6.5em transparent,
  inset 0 -6.5em transparent; 
}

#intro .intro-info .btn-get-started:hover,
#intro .intro-info .btn-services:hover {
  background: transparent;
  border: 1px solid #292F4B;
  color: #292F4B;
  height: 39.5px;
}

.btn-services:hover {
  background: transparent;
  color: #292F4B;
  transition: 0.3s;
  box-shadow:
  inset 0 -6.5em transparent,
  inset 0 -6.5em transparent; 
}

/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/

/* Desktop Navigation */

.main-nav {
  /* Drop Down */
  /* Deep Drop Down */
}

.main-nav,
.main-nav * {
  margin: 0;
  padding: 0;
  list-style: none;
  line-height: 50px;
}

.main-nav > ul > li {
  position: relative;
  white-space: nowrap;
  float: left;
}

.main-nav a {
  /* display: block; */
  position: relative;
  color: #292F4B;
  padding: 0px 15px;
  transition: 0.3s;
  font-size: 14px;
  font-family: "Rubik",sans-serif;
  /* text-transform: uppercase; */
  font-weight: 400;
}

.main-nav a:hover,
.main-nav .active > a,
.main-nav li:hover > a {
  color: #E2A69A;
  text-decoration: none;
}

.main-nav .drop-down ul {
  display: block;
  position: absolute;
  left: 0;
  top: calc(100% - 30px);
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  padding: 10px 0;
  background: #fff;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  transition: ease all 0.3s;
}

.main-nav .drop-down:hover > ul {
  opacity: 1;
  top: 100%;
  visibility: visible;
}

.main-nav .drop-down li {
  min-width: 180px;
  position: relative;
}

.main-nav .drop-down ul a {
  padding: 10px 20px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
  color: #065e77;
}

.main-nav .drop-down ul a:hover,
.main-nav .drop-down ul .active > a,
.main-nav .drop-down ul li:hover > a {
  color: #1bb1dc;
}

.main-nav .drop-down > a:after {
  content: "\f107";
  font-family: FontAwesome;
  padding-left: 10px;
}

.main-nav .drop-down .drop-down ul {
  top: 0;
  left: calc(100% - 30px);
}

.main-nav .drop-down .drop-down:hover > ul {
  opacity: 1;
  top: 0;
  left: 100%;
}

.main-nav .drop-down .drop-down > a {
  padding-right: 35px;
}

.main-nav .drop-down .drop-down > a:after {
  content: "\f105";
  position: absolute;
  right: 15px;
}

/* Mobile Navigation */

.mobile-nav {
  position: fixed;
  top: 0;
  bottom: 0;
  z-index: 9999;
  overflow-y: auto;
  left: -288px;
  width: 288px;
  padding-top: 18px;
  /* background: rgba(40, 38, 70, 0.8); */
  transition: 0.4s;
  /* background: url(../img/mobile/fb_star_container.svg); */
  background: white;
  background-size: contain;
}

.mobile-nav * {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mobile-nav a {
  display: block;
  position: relative;
  color: #292F4B;
  padding: 10px 20px;
  font-weight: 400;
  font-size: 14px;
}

.mobile-nav a:hover,
.mobile-nav .active > a,
.mobile-nav li:hover > a {
  color: #E2A69A;
  text-decoration: none;
}

.mobile-nav .drop-down > a:after {
  content: "\f078";
  font-family: FontAwesome;
  padding-left: 10px;
  position: absolute;
  right: 15px;
}

.mobile-nav .active.drop-down > a:after {
  content: "\f077";
}

.mobile-nav .drop-down > a {
  padding-right: 35px;
}

.mobile-nav .drop-down ul {
  display: none;
  overflow: hidden;
}

.mobile-nav .drop-down li {
  padding-left: 20px;
}

.mobile-nav-toggle {
  position: fixed;
  right: 0;
  top: 0;
  z-index: 9998;
  border: 0;
  background: none;
  font-size: 24px;
  transition: all 0.4s;
  outline: none !important;
  line-height: 1;
  cursor: pointer;
  text-align: right;
}

.mobile-nav-toggle i {
  margin: 26px 26px 0 0;
  color: rgb(41, 47, 75);
}

.mobile-nav-overly {
  width: 100%;
  height: 100%;
  z-index: 9997;
  top: 0;
  left: 0;
  position: fixed;
  background: rgba(0, 0, 0, 0.4);
  overflow: hidden;
  display: none;
}

.mobile-nav-active {
  overflow: hidden;
}

.mobile-nav-active .mobile-nav {
  left: 0;
}

.mobile-nav-active .mobile-nav-toggle i {
  color: #fff;
}

/*--------------------------------------------------------------
# Sections
--------------------------------------------------------------*/

/* Sections Header
--------------------------------*/

/* .section-header h3 {
  font-size: 36px;
  color: #413e66;
  text-align: center;
  font-weight: 700;
  position: relative;
  font-family: "Rubik", sans-serif;
} */

.section-header p {
  text-align: center;
  margin: auto;
  font-size: 15px;
  padding-bottom: 60px;
  color: #535074;
  width: 50%;
}

/* Section with background
--------------------------------*/

.section-bg {
  background: #fff;
}

/* About Us Section
--------------------------------*/

#about {
  padding: 0px 0;
  background: url('../img/Wave.svg') no-repeat;
  max-height: 484px;
}

#wave_red{
  padding: 0px 0;
  background: url('../img/wave_blue.svg') no-repeat;
  height: 100%;
  background-size: cover;
  position: relative;
  z-index: 2;
}


.bottom_border{
  border-bottom: 1px solid #E2A69A;
}

.border-top-guias{
  height: 56px;
  line-height: 56px;
  border-top: 1px solid#E3E3E3;
}

#notfound{
  /* background: url('../img/stuff/img_footer.png') no-repeat; */
  background: #f7f7f7;
  min-height: 450px;
  width: 100%;
}

#notfound .row.d-flex{
  margin: 24px 0;
  height: auto;
}

#graphs{
  padding-bottom: 60px;
}

#parceiros input, #parceiros select, #parceiros textarea{
  border: 1px solid #292F4B;
}

#parceiros .group .label{
  color: #292F4B
}

#parceiros input[type="text"]:not(:placeholder-shown) ~ .label, #parceiros input[type="email"]:not(:placeholder-shown) ~ .label, #parceiros textarea:not(:placeholder-shown) ~ .label{
  background: #ABDBAE;
}



#parceiros {
  padding: 0px;
  min-height: 812px;
  background: #ABDBAE;
  display: flex;
  justify-content: center;
  align-items: center;
}

#guias{
  height: 100%;
  margin-top: 80px;
  /* background-color: #292F4B; */
}

#guias a:focus{
  color: #292F4B!important
}

#guias a:hover{ color: #E2A69A!important}

#beneficios{
  padding: 0px 0;
  /* background: #F7F7F7; */
  /* max-height: 418px; */
}

.title-blue{
  font-size: 24px;
  color: #09B6CD!important;
  text-align: center;
  /* letter-spacing: 1px; */
}

.title-new{
  color: #292F4B;
  font-size: 30px; 
  text-align: center; 
  font-style: normal; 
  padding-top: 100px; 
  margin-bottom: 90px;
}

.letter{
  letter-spacing: 4px;
}

.btn_default_dark{
  font-size: 13px;
  border-radius: 19px;
  font-weight: normal;
  letter-spacing: 1px;
  display: inline-block;
  padding: 10px;
  text-align: center;
  transition: 0.5s;
  color: #fff;
  background: #E2A69A;
  color: #fff;
}

.btn_default_dark:hover{
  background-color:#E2A69A;
  opacity: 0.65;
  color: white;
}

.guias-active{
  width: 160px;
  display: block;
  color: white;
  background: #292F4B;
  padding: 20px;
  padding-top: 20px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  padding-top: 11px;
  text-align: center;
  font-size: 14px;
}

.guias:hover{
  color: #292F4B;
}

.guias:focus{
  color: #292F4B;
}

.guias-active:hover{
  color: white;
}

.guias-active:focus{
  color: white;
}


.guias{
  width: 160px;
  display: block;
  font-size: 14px;
  color: #292F4B;
  text-align: center;
  border: 1px solid #292F4B;
  padding: 20px;
  padding-top: 20px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  padding-top: 11px;
  transition: none;
}

.p-right{
  padding-left: 4px;
}

.p-left{
  padding-right: 4px;
}



/*  */

.labelTerms {
  display: block;
  position: relative;
  padding-left: 22px;
  margin-bottom: 0px;
  cursor: pointer;
  font-size: 12px;
  color: #9E9E9E;
  text-align: justify;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  margin-bottom: 24px;
}

/* #dadosMaePai a:not([href]):not([tabindex]){
  color: #09B6CD!important;
} */

/* Hide the browser's default checkbox */
.labelTerms input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 14px;
  width: 14px;
  border: 2px solid #292F4B;
  border-radius: 3px;
}

/* On mouse-over, add a grey background color */
.labelTerms:hover input ~ .checkmark {
  background-color: white;
}

/* When the checkbox is checked, add a blue background */
.labelTerms input:checked ~ .checkmark {
  background-color:#292F4B;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.labelTerms input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.labelTerms .checkmark:after {
  left: 3px;
  top: 0px;
  width: 5px;
  height: 9px;
  border: solid white;
  border-width: 0 1.5px 1.5px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.separador-vertical{
  width: 100%;
  height: calc(100% - 34px);
  border-right: 1px solid #E3E3E3;
}

/*  */
.top{
  max-width: 1350px;
  margin: auto;
  padding-top: 60px;
}

#about .about-content {
  padding-top: 40px;
}

#about .about-content h2 {
  color: #413e66;
  font-family: "Rubik", sans-serif;
  font-weight: 700;
}


#about .about-content ul {
  list-style: none;
  padding: 0;
}

#about .about-content ul li {
  padding-bottom: 10px;
}

#about .about-content ul li i {
  font-size: 20px;
  padding-right: 4px;
  color: #1bb1dc;
}

#about .about-img {
  position: relative;
  margin: 30px 30px 30px 30px;
}

#about .about-img img {
  width: 100%;
  border: 8px solid #fff;
  transition: .5s;
}

#about .about-img img:hover {
  width: 100%;
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
}

#about .about-img::before {
  position: absolute;
  left: -31px;
  top: -30px;
  width: 90%;
  height: 92%;
  z-index: -1;
  content: '';
  background-color: #ebf1fa;
  transition: .5s;
}

#about .about-img::after {
  position: absolute;
  right: -31px;
  bottom: -30px;
  width: 90%;
  height: 92%;
  z-index: -1;
  content: '';
  background-color: #ebf1fa;
  transition: .5s;
}

/* Services Section
--------------------------------*/

#services {
  padding: 60px 0 80px 0;
}

#services .box {
  padding: 30px;
  padding-left: 10px;
  padding-right: 10px;
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  /* margin: 0 10px 40px 10px; */
  background: #fff;
  /* box-shadow: 0 10px 29px 0 rgba(68, 88, 144, 0.1); */
  transition: all 0.3s ease-in-out;
  text-align: center;
}

/* #services .box:hover {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
} */

#services .icon {
  margin: 0 auto 15px auto;
  padding-top: 12px;
  display: inline-block;
  text-align: center;
  border-radius: 50%;
  width: 60px;
  height: 60px;
}

#services .icon i {
  font-size: 36px;
  line-height: 1;
}

#services .title {
  font-weight: 300;
  margin-bottom: 15px;
  font-size: 18px;
}

#services .title a {
  color: #111;
}

#services .box:hover .title a {
  color: #1bb1dc;
}

#services .description {
  font-size: 14px;
  line-height: 28px;
  margin-bottom: 0;
  text-align: left;
}

/* Why Us Section
--------------------------------*/

#why-us {
  padding: 60px 0;
}

#why-us .why-us-content .features {
  margin: 0 0 15px 0;
  padding: 0;
  transition: 0.3s ease-in-out;
}

#why-us .why-us-content .features i {
  font-size: 36px;
  float: left;
}

#why-us .why-us-content .features h4 {
  font-size: 24px;
  font-weight: normal;
  margin-left: 56px;
  color: #413e66;
  margin-bottom: 5px;
}

#why-us .why-us-content .features p {
  font-size: 16px;
  margin-left: 56px;
  color: #555186;
}

#why-us .counters {
  padding-top: 40px;
}

#why-us .counters span {
  font-family: "Rubik", sans-serif;
  font-weight: bold;
  font-size: 48px;
  display: block;
  color: #555186;
}

#why-us .counters p {
  padding: 0;
  margin: 0 0 20px 0;
  font-family: "Rubik", sans-serif;
  font-size: 14px;
  color: #8a87b6;
}

/* Call To Action Section
--------------------------------*/

#call-to-action {
  background: url(../img/stuff/baby_video.png);
  background-size: cover;
  padding: 40px 0;
  height: 400px
}

#call-to-action .cta-title {
  color: #fff;
  font-size: 28px;
  font-weight: 700;
}

#call-to-action .cta-text {
  color: #fff;
}

#call-to-action .cta-btn {
  font-family: "Rubik", sans-serif;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 8px 26px;
  border-radius: 3px;
  transition: 0.5s;
  margin: 10px;
  border: 3px solid #fff;
  color: #fff;
}

#call-to-action .cta-btn:hover {
  background: #1bb1dc;
  border: 3px solid #1bb1dc;
}

/* Features Section
--------------------------------*/

#features {
  padding: 80px 0;
}

#features h4 {
  font-weight: normal;
  font-size: 24px;
}

/* Portfolio Section
--------------------------------*/

#portfolio {
  padding: 60px 0;
}

#portfolio #portfolio-flters {
  padding: 0;
  margin: 5px 0 35px 0;
  list-style: none;
  text-align: center;
}

#portfolio #portfolio-flters li {
  cursor: pointer;
  margin: 15px 15px 15px 0;
  display: inline-block;
  padding: 6px 10px;
  font-size: 16px;
  line-height: 20px;
  color: #413e66;
  margin-bottom: 5px;
  transition: all 0.3s ease-in-out;
}

#portfolio #portfolio-flters li:hover,
#portfolio #portfolio-flters li.filter-active {
  color: #1bb1dc;
}

#portfolio #portfolio-flters li:last-child {
  margin-right: 0;
}

#portfolio .portfolio-item {
  position: relative;
  overflow: hidden;
  margin-bottom: 30px;
}

#portfolio .portfolio-item .portfolio-wrap {
  overflow: hidden;
  position: relative;
  margin: 0;
}

#portfolio .portfolio-item .portfolio-wrap:hover img {
  opacity: 0.4;
  transition: 0.3s;
}

#portfolio .portfolio-item .portfolio-wrap .portfolio-info {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  text-align: center;
  opacity: 0;
  transition: 0.2s linear;
}

.paragraph{
  color: #E2A69A; font-size: 20px; text-align: left; text-transform: uppercase; font-style: normal; padding-top: 40px;
}

.text {
  margin: 0!important;
  width: 100%!important;
  text-align: justify!important;
  padding: 0!important;
  font-size: 14px!important;
  color: #9E9E9E;
}

#portfolio .portfolio-item .portfolio-wrap .portfolio-info h4 {
  font-size: 22px;
  line-height: 1px;
  font-weight: 700;
  margin-bottom: 14px;
  padding-bottom: 0;
}

#portfolio .portfolio-item .portfolio-wrap .portfolio-info h4 a {
  color: #fff;
}

#portfolio .portfolio-item .portfolio-wrap .portfolio-info h4 a:hover {
  color: #1bb1dc;
}

#portfolio .portfolio-item .portfolio-wrap .portfolio-info p {
  padding: 0;
  margin: 0;
  color: #f8fcff;
  font-weight: 500;
  font-size: 14px;
  text-transform: uppercase;
}

#portfolio .portfolio-item .portfolio-wrap .portfolio-info .link-preview,
#portfolio .portfolio-item .portfolio-wrap .portfolio-info .link-details {
  display: inline-block;
  line-height: 1;
  text-align: center;
  width: 36px;
  height: 36px;
  background: #1bb1dc;
  border-radius: 50%;
  margin: 10px 4px 0 4px;
}

#portfolio .portfolio-item .portfolio-wrap .portfolio-info .link-preview i,
#portfolio .portfolio-item .portfolio-wrap .portfolio-info .link-details i {
  padding-top: 6px;
  font-size: 22px;
  color: #fff;
}

#portfolio .portfolio-item .portfolio-wrap .portfolio-info .link-preview:hover,
#portfolio .portfolio-item .portfolio-wrap .portfolio-info .link-details:hover {
  background: #42c3e8;
}

#portfolio .portfolio-item .portfolio-wrap .portfolio-info .link-preview:hover i,
#portfolio .portfolio-item .portfolio-wrap .portfolio-info .link-details:hover i {
  color: #fff;
}

#portfolio .portfolio-item .portfolio-wrap:hover {
  background: #282646;
}

#portfolio .portfolio-item .portfolio-wrap:hover .portfolio-info {
  opacity: 1;
}

/* Testimonials Section
--------------------------------*/

#testimonials {
  padding: 60px 0;
  background: url(../img/Wave_grey.svg) no-repeat;
  background-size: cover;
}

.testimonials-carousel{
  position: relative;
}

#testimonials .owl-prev{
  width: 20px;
  height: 20px;
  position: absolute;
  left: -32px;
  top: 132px;
}

#testimonials .owl-next{
  width: 20px;
  height: 20px;
  position: absolute;
  right: -32px;
  top: 132px;
}

.flex-box-special {
  height: 92%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  background: #FDF2B3;
  border-radius: 30px;
  position: absolute;
  z-index: 2;
  top: 0;
  max-width: 96%;
}

#testimonials .background {
  background: url(../img/update/star.svg) no-repeat center;
  background-size: contain;
}
 

#testimonials .section-header {
  margin-bottom: 40px;
  margin-top: 60px;
}

#testimonials .testimonial-item .testimonial-img {
  width: 107px;
  border-radius: 50%;
  border: 4px solid #fff;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: -15%;
  z-index: 9998;
}

#testimonials .testimonial-item h3 {
  font-size: 18px;
  font-weight: 500;
  color: #292F4B;
  text-align: center;
  margin: 0;
}

#testimonials .testimonial-item h4 {
  font-size: 12px;
  color: #292F4B;
  font-weight: 400;
  text-align: center;
  margin: 0;
}

#testimonials .testimonial-item p {
  font-style: normal;
  padding: 50px 80px;
  margin: 0;
  text-align: center;
  font-size: 14px;
  color: #292F4B !important;
}

.owl-nav,
.owl-dots {
  margin-top: 5px;
  text-align: center;
}

.owl-dot {
  display: inline-block;
  margin: 0 5px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background-color: #ddd!important;
}

.owl-dot.active {
  background-color: #292F4B!important;
}

/* Team Section
--------------------------------*/

#team {
  padding: 60px 0;
}

#team .member {
  text-align: center;
  margin-bottom: 20px;
  position: relative;
  overflow: hidden;
}

#team .member .member-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  transition: 0.2s;
  padding: 15px 0;
  background: rgba(29, 28, 41, 0.6);
}

#team .member .member-info-content {
  transition: margin 0.2s;
  height: 40px;
  transition: height 0.4s;
}

#team .member:hover .member-info {
  transition: 0.4s;
}

#team .member:hover .member-info-content {
  height: 80px;
}

#team .member h4 {
  font-weight: 700;
  margin-bottom: 2px;
  font-size: 18px;
  color: #fff;
}

#team .member span {
  font-style: italic;
  display: block;
  font-size: 13px;
  color: #fff;
}

#team .member .social {
  margin-top: 15px;
}

#team .member .social a {
  transition: none;
  color: #fff;
}

#team .member .social a:hover {
  color: #1bb1dc;
}

#team .member .social i {
  font-size: 18px;
  margin: 0 2px;
}

/* Clients Section
--------------------------------*/

#clients {
  padding: 60px 0;
}

#clients img {
  max-width: 80%;
  opacity: 0.5;
  transition: 0.3s;
  padding: 15px 0;
}

#clients img:hover {
  opacity: 1;
}

#clients .owl-nav,
#clients .owl-dots {
  margin-top: 5px;
  text-align: center;
}

#clients .owl-dot {
  display: inline-block;
  margin: 0 5px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: #ddd;
}

#clients .owl-dot.active {
  background-color: #1bb1dc;
}

/* Pricing Section
--------------------------------*/

#pricing {
  padding: 80px 0;
}

#pricing .card {
  border: 0;
  border-radius: 0px;
  box-shadow: 0 3px 0px 0 rgba(65, 62, 102, 0.08);
  transition: all .3s ease-in-out;
  padding: 36px 0;
  position: relative;
}

#pricing .card:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 0%;
  height: 5px;
  background-color: #1bb1dc;
  transition: 0.5s;
}

#pricing .card:hover {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
  box-shadow: 0 20px 35px 0 rgba(0, 0, 0, 0.08);
}

#pricing .card:hover:after {
  width: 100%;
}

#pricing .card .card-header {
  background-color: white;
  border-bottom: 0px;
  -moz-text-align-last: center;
  text-align-last: center;
}

#pricing .card .card-title {
  margin-bottom: 16px;
  color: #535074;
}

#pricing .card .card-block {
  padding-top: 0;
  text-align: center;
}

#pricing .card .list-group-item {
  border: 0px;
  padding: 6px;
  color: #413e66;
  font-weight: 300;
}

#pricing .card h3 {
  font-size: 64px;
  margin-bottom: 0px;
  color: #535074;
}

#pricing .card h3 .currency {
  font-size: 30px;
  position: relative;
  font-weight: 400;
  top: -30px;
  letter-spacing: 0px;
}

#pricing .card h3 .period {
  font-size: 16px;
  color: #6c67a3;
  letter-spacing: 0px;
}

#pricing .card .list-group {
  margin-bottom: 15px;
}

#pricing .card .btn {
  text-transform: uppercase;
  font-size: 13px;
  font-weight: 500;
  color: #5f5b96;
  border-radius: 0;
  padding: 10px 24px;
  letter-spacing: 1px;
  border-radius: 3px;
  display: inline-block;
  background: #1bb1dc;
  color: #fff;
}

#pricing .card .btn:hover {
  background: #0a98c0;
}

/* Frequently Asked Questions Section
--------------------------------*/

#faq {
  padding: 120px 0;
  padding-bottom: 80px;
  overflow: hidden;
  background: #F7F7F7;
  background: url(../img/wave_white.svg);
  margin-top: -40px;
}

#faq #faq-list {
  padding: 0;
  list-style: none;
}

#faq #faq-list a:focus{
  color: #292F4B!important;
}

/* #faq #faq-list li {
  border-bottom: 1px solid #ebebeb;
} */

#faq #faq-list a {
  padding: 22px 34px 22px 22px;
  display: block;
  position: relative;
  font-family: "Rubik", sans-serif;
  font-size: 14px;
  line-height: 1;
  background: #F0F0F0;
  font-weight: 400;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  /* margin-bottom: 16px; */
}

#faq #faq-list i {
  font-size: 24px;
  position: absolute;
  right: 16px;
  top: 16px;
}

#faq #faq-list p {
  margin-bottom: 0px;
  font-weight: 100;
  font-size: 14px;
}

#faq #faq-list a.collapse {
  color: #1bb1dc;
}

#faq #faq-list a.collapsed {
  color: #292F4B;
}

#faq #faq-list a.collapsed i::before {
  content: "\f107" !important;
}

#guias a.collapsed i::before{
  content: "\e805"!important;
}

.fa-minus::before{
  content: "\eaa6"!important;
}

.padding{
  border-radius: 4px;
  background-color: #FAFAFA;
  padding: 16px;
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/

#footer {
  padding: 50px 0 50px 0;
  font-size: 14px;
  background: #ABDBAE;
}

#footer .footer-top {
  padding: 60px 0 30px 0;
  background: #f5f8fd;
}

#footer .footer-top .footer-info {
  margin-bottom: 30px;
}

#footer .footer-top .footer-info h3 {
  font-size: 34px;
  margin: 0 0 20px 0;
  padding: 2px 0 2px 0;
  line-height: 1;
  font-family: "Rubik", sans-serif;
  color: #413e66;
  font-weight: 400;
  letter-spacing: 3px;
  text-transform: uppercase;
}

#footer .footer-top .footer-info p {
  font-size: 13px;
  line-height: 24px;
  margin-bottom: 0;
  font-family: "Rubik", sans-serif;
  color: #535074;
}

#footer .footer-top .social-links a {
  font-size: 18px;
  display: inline-block;
  background: #1bb1dc;
  color: #fff;
  line-height: 1;
  padding: 8px 0;
  margin-right: 4px;
  border-radius: 50%;
  text-align: center;
  width: 36px;
  height: 36px;
  transition: 0.3s;
}

#footer .footer-top .social-links a:hover {
  background: #0a98c0;
  color: #fff;
}

#footer .footer-top h4 {
  font-size: 14px;
  font-weight: bold;
  color: #413e66;
  text-transform: uppercase;
  position: relative;
  padding-bottom: 10px;
}

#footer .footer-top .footer-links {
  margin-bottom: 30px;
}

#footer .footer-top .footer-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

#footer .footer-top .footer-links ul li {
  padding: 8px 0;
}

#footer .footer-top .footer-links ul li:first-child {
  padding-top: 0;
}

#footer .footer-top .footer-links ul a {
  color: #696592;
}

#footer .footer-top .footer-links ul a:hover {
  color: #1bb1dc;
}

#footer .footer-top .footer-contact {
  margin-bottom: 30px;
}

#footer .footer-top .footer-contact p {
  line-height: 26px;
}

#footer .footer-top .footer-newsletter {
  margin-bottom: 30px;
}

#footer .footer-top .footer-newsletter input[type="email"] {
  border: 0;
  padding: 6px 8px;
  width: 65%;
  border: 1px solid #d9dde6;
}

#footer .footer-top .footer-newsletter input[type="submit"] {
  background: #1bb1dc;
  border: 1px solid #1bb1dc;
  width: 35%;
  padding: 6px 0;
  text-align: center;
  color: #fff;
  transition: 0.3s;
  cursor: pointer;
}

#footer .footer-top .footer-newsletter input[type="submit"]:hover {
  background: #0a98c0;
}

#footer .footer-top .form .form-group {
  margin-bottom: 15px;
}

#footer .footer-top .form #sendmessage {
  color: #fff;
  background: #1bb1dc;
  display: none;
  text-align: center;
  padding: 15px;
  font-weight: normal;
  margin-bottom: 15px;
}

#footer .footer-top .form #errormessage {
  color: #fff;
  display: none;
  background: red;
  text-align: center;
  padding: 15px;
  font-weight: normal;
  margin-bottom: 15px;
}

#footer .footer-top .form #sendmessage.show,
#footer .footer-top .form #errormessage.show,
#footer .footer-top .form .show {
  display: block;
}

#footer .footer-top .form .validation {
  color: red;
  display: none;
  margin: 0 0 20px;
  font-weight: 400;
  font-size: 13px;
}

#footer .footer-top .form label {
  color: #413e66;
  font-weight: 500;
}

#footer .footer-top .form input,
#footer .footer-top .form textarea {
  border-radius: 0;
  box-shadow: none;
  border: 1px solid #dce1ec;
  font-size: 14px;
}

#footer .footer-top .form input::-webkit-input-placeholder,
#footer .footer-top .form textarea::-webkit-input-placeholder {
  color: #a2a0bd;
}

#footer .footer-top .form input::-moz-placeholder,
#footer .footer-top .form textarea::-moz-placeholder {
  color: #a2a0bd;
}

#footer .footer-top .form input:-ms-input-placeholder,
#footer .footer-top .form textarea:-ms-input-placeholder {
  color: #a2a0bd;
}

#footer .footer-top .form input::placeholder,
#footer .footer-top .form textarea::placeholder {
  color: #a2a0bd;
}

#footer .footer-top .form button[type="submit"] {
  background: #1bb1dc;
  border: 0;
  border-radius: 3px;
  padding: 8px 30px;
  color: #fff;
  transition: 0.3s;
}

#footer .footer-top .form button[type="submit"]:hover {
  background: #0a98c0;
  cursor: pointer;
}

#footer .copyright {
  text-align: left;
  padding-top: 15px;
  color: white;
  font-size: 15px;
}

#footer .credits {
  text-align: center;
  font-size: 14px;
  padding-top: 4px;
  color: white;
}

#footer .credits a {
  color: white;
}

#footer .credits a:hover {
  color: white;
}

.default_color{
  color:#E2A69A
}

.default_bg{
  background-color: #E2A69A
}

#header .logo img{
  transform: scale(1.5);
}


/*--------------------------------------------------------------
# Responsive Media Queries
--------------------------------------------------------------*/

@media (min-width: 991px) {
  #call-to-action .cta-btn-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
  }
}

@media (min-width: 992px) {
  #intro .intro-info {
    padding-top: 80px;
  }

  #testimonials .testimonial-item p {
    width: 100%;
  }
}

@media (max-width: 991px) {

  /* .botaoPedirBabyBoxLaranjaParaBranco{
    display: none
  } */

  .p-left{
    padding-right: 15px;
  }

  .p-right{
    padding-left: 15px;
  }

  #testimonials .testimonial-item p {
    padding: 30px 20px 30px 20px;
  }

  .owl-item::before {
    height: 470px;
  }

  #testimonials .owl-item{
    min-height: 500px
  }

  .flex-box-special{
    min-width: 100%;
  }

  #parceiros h3{
    font-size: 30px!important;
    margin-top: 60px;
  }

  #parceiros .container{
    padding-bottom: 100px;
  }

  #parceiros .baby-parceiros-image{
    display: none
  }

  #parceiros .col{
    margin: 0!important;
  }

  #parceiros .buttons{
    width: 100%;
  }

  #parceiros .buttons a{
    width: 100%!important;
  }

  #homepage{
    background: #f5f8fd url("../img/mobile/fb_star_container.svg") center no-repeat;
    background-size: cover;
  }

  .header_text > img:nth-child(1) {
    display: none;
   }
   

  .nomargin{
    margin: 0!important;
  }
  .header_text h1{
    font-size: 47px!important;
  }

  /* #intro .justify-content-center > div:nth-child(1) {
    padding-left: 24px!important;
  }   */
  
  #wave_red {
    height: 100%!important;
  }

  #wave_red > div:nth-child(1) > div:nth-child(1){
    padding: 100px 0!important;
  }

  .align-top {
    max-width: 100%!important;
  }
  


  #homepage .header_text > p:nth-child(3) {
    max-width: 100%!important;
  }

  #homepage .header_text > p:nth-child(4) {
    max-width: 100%!important;
  }   


  .m310{
    max-width: 100%!important;
  }
  
  .m340{
    max-width: 100%!important;
  }

  .header_text h3{
    font-size: 24px!important;
    margin-top: 0px!important;
  }

  .baby_font:first-of-type{
    margin-bottom: 0;
  }
  #topbar {
    display: none;
  }

  #header {
    height: 70px;
    padding: 15px 0;
  }

  #header .logo h1 {
    font-size: 28px;
    padding: 8px 0;
  }

  #why-us .why-us-content {
    padding-top: 30px;
  }

  #pricing {
    padding-bottom: 30px;
  }

  #pricing .card {
    margin-bottom: 50px;
  }
}

@media (max-width: 768px) {
  .back-to-top {
    bottom: 15px;
  }

  #faq #faq-list a {
    font-size: 14px;
  }

  #faq #faq-list i {
    top: 13px;
  }
}

@media (max-height: 600px) {
  #intro{
    height: 100vh!important;
  }
}

.whiteSpaceNoWrap{
  white-space: nowrap;
}

.add{
  max-width: 300px;
}

.mobile{
  display: none;
}


#homepage .container.h-100{
  display: flex !important;
}

.desktop{
  display: block;
}

#stepbystep .primeiro_passo img{
  margin-right: 8px
}

#stepbystep .segundo_passo img{
  margin-right: 8px
}

#stepbystep .terceiro_passo img{
  margin-right: 8px
}

@media (min-width: 1500px) {
  .container{
    max-width: 1400px;
  }
  #intro .right-side-content .text{
    font-size: 16px!important;
  }
}

@media screen and (min-width: 1300px) and (max-width: 1400px) {
  .container{
    max-width: 1200px;
  }
}

@media screen and (max-width: 1400px){
  .left-side-img{
    right: 279px!important;
  }
}

.font-16{
  text-align: justify;
}

@media screen and (min-width: 1000px) and (max-width: 1500px) {
  .text_top{ 
    width: 50%!important;
    font-size: 32px!important;
    margin-top: 12%!important;
  }   

  .font-16{
    font-size: 14px!important;
  }

  .veronica {
    background-size: contain!important;
  }   
}

.tiles {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.tile {
  position: relative;
  float: right;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.photo {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  transition: transform .5s ease-out;
}



#slide .owl-item{
  border: none;
  height: auto;
  border-radius: 0px;
  margin-top: 10px!important;
}

@media (max-width: 991px) {
  #intro {
    height: 100%!important;
  }
  .whiteSpaceNoWrap{
    white-space: normal!important;
  }

  .secondStepFont{
    font-size: 13px!important;
  }

  .firstStepFont{
    font-size: 14px!important;
  }
  #header .logo img{
    transform: none!important;
  }

  #about{
    max-height: unset!important;
  }

  #pedirBabyBoxGratis header h3{
    font-size: 24px!important;
  }

  /* #pedirBabyBoxGratis{ */
    /* background-image:url(../img/mobile/mb_footer.png?v=1) */
  /* } */

  /* #pedirBabyBoxGratis .section-header{
    padding-left: 110px;
  } */

  #sucesso{
    /* height: 100%; */
    padding-bottom: 100px;
  }

  #sucesso > div:nth-child(1) {
    /* padding: 120px 30px 0px; */
  }

  #sucesso .nuvens{
    top: -100px!important;
    right: 0!important;
  }

  #sucesso .nuvens img{
    width: 200px!important;
  }

  .desktop{
    display: none!important;
  }

  .justifyContent{
    justify-content: center !important;
  }

  #stepbystep .primeiro_passo img{
    margin-right: 0px
  }
  
  #stepbystep .segundo_passo img{
    margin-right: 0px
  }
  
  #stepbystep .terceiro_passo img{
    margin-right: 0px
  }

  #stepbystep .primeiro_passo{
    text-align: center;
    min-width: unset!important;
    padding-left: 0!important;
    margin-bottom: 0!important;
    margin-right: 8px
  }

  .mobile_aviao{
    height: 100px!important;
    background-size: contain!important;
  }

  #stepbystep .segundo_passo{
    text-align: center;
    min-width: unset!important;
    margin-right: 8px
  }

  #stepbystep .terceiro_passo{
    text-align: center;
    min-width: unset!important;
    margin-right: 8px
  }

  .obterBabyBox .row.justify-content-center.d-flex.align-items-center{
    padding-bottom: 30px;
  }

  .mobile_m_bottom{
    margin-bottom: 48px;
  }
  
  .obterBabyBox{
    background: url(../img/mobile/baby_mobile.png);
    background-position: center;
    background-size: cover;
  }

  #beneficios{
    padding-left: 0px;
    max-height: unset!important;
  }

  #notfound > div:nth-child(1) > header:nth-child(1) > h3:nth-child(1){
    font-size: 25px!important;
  }

  div.justify-content-md-center:nth-child(1) > p:nth-child(1){
    font-size: 25px!important;
  }

  div.justify-content-md-center:nth-child(1) > p:nth-child(2) {
    font-size: 16px!important;
  }


  #notfound {
   min-height: 600px;
}

  #notfound h3{
    font-size: 25px!important;
  }

  .removeMobile{
    height: auto!important;
    line-height: 1.25!important;
    padding: 16px!important;
  }
  #call-to-action {
    background: url(../img/mobile/baby_video_mobile.png);
    background-size: auto;
    background-size: cover;
    }

  #parceiros{
    max-height: unset!important;
    /* background-size: cover!important; */
  }

  div.primeiro_passo:nth-child(1) {
    min-width: 100%!important;
    padding-left: 30px;
    margin-bottom: 25px;
    }
    
    div.primeiro_passo:nth-child(2) {
    min-width: 100%!important;
    margin-bottom: 25px;
    padding-left: 30px;
    }
    
    div.primeiro_passo:nth-child(3) {
    min-width: 100%!important;
    padding-left: 30px;
    }
    
    div.primeiro_passo:nth-child(1) > div:nth-child(2) {
    text-align: left;
    }
    
    div.primeiro_passo:nth-child(2) > div:nth-child(2) {
    text-align: left;
    }
    
    div.primeiro_passo:nth-child(3) > div:nth-child(2) {
    text-align: left;
    }
    
    .mobileSize{
    font-size: 25px!important;
    padding-bottom: 60px;
    }

    #obterBabyBox .box{
      flex-direction: column;
    }

    #obterBabyBox{
      height: 100%!important;
      margin-top: -80px!important;
      padding-bottom: 60px;
    }

    #obterBabyBox .title-new.text-white{
        max-width: 280px;
        margin: 0 auto;
        padding-top: 150px;
    }

    #main .title{
      font-size: 24px!important;
    }

    #obterBabyBox .box .step.one .img{
      width: 180px!important;
      height: 160px!important;
    }

    #obterBabyBox .box .step.two .img{
      width: 191px!important;
      height: 160px!important;
    }

    #obterBabyBox .box .step.three .img{
      width: 180px!important;
      height: 160px!important;
    }

    #obterBabyBox .box .step{
      margin-bottom: 24px;
    }

    .section-header h3{
      /* margin-top: 12px; */
      font-size: 29px!important;
    }

    #obterBabyBox .box .step .text {
      font-size: 20px !important;
    }

  #homepage .container.h-100{
      display: flex !important;
      flex-direction: column;
      justify-content: center;
      align-content: center;
      height: 100vh !important;
  }

  #homepage .align-self-center .col-12.col-lg-12 {
    padding-left: 0px!important;
  }   

  .align-self-center > div:nth-child(1) > p:nth-child(3) {
    font-size: 16px!important;
   }
   

  #homepage .mobile{
    height: 350px!important;
    background-position: right!important;
    margin-top: -48px
  }
  
  .title-new{
    font-size: 24px;
  }

  .flex-column-margin{
    display: flex;
    flex-direction: column;
    margin-bottom: 24px;
  }

  .flex-column-margin div:first-of-type span{
    font-size: 80px;
    margin-bottom: -20px;
  }


  .owl-item{
    max-width: 292px;
    margin-left: auto;
    margin-right: auto;
  }

  .mobile{
    display: block;
  }

  .add{
    max-width: 100%!important;
  }
  .baby_font_regular{
    font-size: 25px!important;
  }

  #about{
    background: url('../img/mobile/mb_wave_blue.svg');
    background-size: cover;
  }

  #homepage .container {
    height: auto !important;
  }

  #homepage .intro-img {
    width: 80%;
  }

  #homepage .intro-info {
    text-align: center;
    padding-top: 40px;
  }

  #homepage .intro-info h2 {
    font-size: 34px;
    margin-bottom: 30px;
  }

  .section-header p {
    width: 100%;
  }

  #testimonials .testimonial-item {
    text-align: left;
  }

  #testimonials .testimonial-item .testimonial-img {
    float: none;
    margin: auto;
  }

  /* NOVAS ALTERAÇOES MOBILE */

  #enviar-duvidas{
    width: 100%;
  }

  #notfound .row.d-flex{
    padding: 24px 0;
  }

  #faq a:hover, #faq a:active, #faq a:focus{
    color: #292F4B;
  }

  #notfound .text-center.mb-0{
    margin-bottom: 24px
  }

  #cta-homepage{
    padding-top: 60px;
    background: #F7f7f7;
    margin-top: 0;
  }

  #cta-homepage .background-special {
    margin-left: 0;
    margin-right: 0;
    padding-bottom: 60px;
  }

  #cta-homepage .image-dark {
    position: relative;
    top: unset;
    left: unset;
    background-size:contain;
  }

  .background-special {
    flex-direction: column;
  } 

  #cta-homepage .content-text {
    margin-right: 0;
    text-align: justify;
  }

  #cta-homepage .title-new.m-0.p-0.text-left{
    margin-top: 24px!important;
  }

  #quotes{
    height: 480px;
    padding-bottom: 100px;
  }

  #quotes .quote-text {
    font-size: 24px; 
  }

  #quotes .quote-image-left {
    left: 0;
    top: -60px;
  }

  #quotes .quote-image-right{
    right: 0;
    bottom: -60px;
  }

  .top-intro .col-lg-6{
    min-height: 400px!important;
    position: relative;
    margin-right: 0!important;
  }

  #intro .image{
    background: url(../img/update/quem-somos/veronica.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
    position: absolute;top: 0px;left: 0px;width: 100%;height: 140%;
  }

  .right-side-content {
    background: white!important;
    padding-top: 24px!important;
  }

  .top-intro .col-lg-5 .title{
    font-size: 24px!important;
    color: #292F4B!important;
    line-height: 24px!important;
  }

  .top-intro .col-lg-5 .text{
    color: #9E9E9E!important;
  }

  #what-motivated-us .row.justify-content-md-center:first-of-type{
    margin: 48px 0!important;
  }

  #what-motivated-us .row.justify-content-md-center .col-lg-5, 
  #what-motivated-us .row.justify-content-md-center .col-lg-10{
    padding: 0!important
  }

  #what-motivated-us .col-lg-5 .image{
    display: none;
  }

  #what-motivated-us .image.image-mobile{
    background: url(../img/update/quem-somos/finland.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  #graphs .title-new{
    text-align: left!important;
    padding: 0 16px;
  }

  #graphs .sub-title{
    text-align: left!important;
    padding: 0 16px;
    margin-top: 12px!important;
  }

  .graphs {
    flex-direction: column;
  }

  .graphs section {
    margin-bottom: 24px;
  }

  #stepbystep.clearfix{
    display: none;
  }

  #stepbystep-mobile {
    padding-top: 100px;
  }

  .babybox-page {
    margin-top: 0;
  }

  .mobile-images-box{
    display: flex!important;
    min-height: 370px!important;
  }

  .no-padding-mobile{
    padding: 0;
  }

  .no-padding-mobile > div{
    margin: 0 3px;
  }

  .appear-on-select{
    transition: 0.3s;
  }

  .desktop-flex{
    display: none!important;
  }

  .mobile-flex{
    display: flex!important;
  }

  .informacao.mt-5{
    margin-top: 80px!important
  }

  .requisitos{
    margin-bottom: 24px;
  }

  .title-new.m-0.p-0{
    font-size: 16px!important;
  }
  
  .apply-color{
    padding-left: 0;
    padding-top: 0;
  }

  #guias{
    margin-top: 24px;
    margin-bottom: 48px;
  }

  #faq{
    padding: 24px 0;
  }

  .removeAbsoluteMobile{
    position: relative!important;
    bottom: unset!important;
  }

}

.mobile-flex{
  display: none
}

@media (max-width: 574px) {
  #footer .footer-top .social-links a {
    margin-bottom: 25px;
  }
}

.red{color:#f009; font-size: 12px;}
/* a:focus{
  color: #292F4B;
} */

@keyframes lds-rolling {
0% {
-webkit-transform: translate(-50%, -50%) rotate(0deg);
transform: translate(-50%, -50%) rotate(0deg);
}
100% {
-webkit-transform: translate(-50%, -50%) rotate(360deg);
transform: translate(-50%, -50%) rotate(360deg);
}
}
@-webkit-keyframes lds-rolling {
0% {
-webkit-transform: translate(-50%, -50%) rotate(0deg);
transform: translate(-50%, -50%) rotate(0deg);
}
100% {
-webkit-transform: translate(-50%, -50%) rotate(360deg);
transform: translate(-50%, -50%) rotate(360deg);
}
}
.lds-rolling {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
margin: 0;
padding: 0;
width: 15px!important;
height: 15px!important;
}
.lds-rolling div,
.lds-rolling div:after {
position: absolute;
width: 20px;
height: 20px;
border: 3px solid #292F4B;
border-top-color: transparent;
border-radius: 50%;
}
.lds-rolling div {
-webkit-animation: lds-rolling 1s linear infinite;
animation: lds-rolling 1s linear infinite;
top: 8px;
left: 6px;
}
.lds-rolling div:after {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}


.lds-css {
position: absolute;
width: 100%;
background: rgba(255,255,255,.6);
height: 100%;
left: 0;
top: 0;
border-radius: 6px;
margin: 0;
padding: 0;
z-index: 9999;
line-height: initial;
text-align: center;
float: left;
clear: both;
}

select {
  /* for Firefox */
  -moz-appearance: none;
  /* for Chrome */
  -webkit-appearance: none;
}

/* For IE10 */
select::-ms-expand {
  display: none;
}



/**
 * 1. The `reverse` animation direction plays the animation backwards
 *    which makes it start at the stroke offset 100 which means displaying
 *    no stroke at all and animating it to the value defined in the SVG
 *    via the inline `stroke-dashoffset` attribute.
 * 2. Rotate by -90 degree to make the starting point of the
 *    stroke the top of the circle.
 * 3. Using CSS transforms on SVG elements is not supported by Internet Explorer
 *    and Edge, use the transform attribute directly on the SVG element as a
 * .  workaround (https://markus.oberlehner.net/blog/pure-css-animated-svg-circle-chart/#part-4-internet-explorer-strikes-back).
 */
 .circle-chart__circle {
  animation: circle-chart-fill 2s reverse; /* 1 */ 
  transform: rotate(-90deg); /* 2, 3 */
  transform-origin: center; /* 4 */
}

/**
 * 1. Rotate by -90 degree to make the starting point of the
 *    stroke the top of the circle.
 * 2. Scaling mirrors the circle to make the stroke move right
 *    to mark a positive chart value.
 * 3. Using CSS transforms on SVG elements is not supported by Internet Explorer
 *    and Edge, use the transform attribute directly on the SVG element as a
 * .  workaround (https://markus.oberlehner.net/blog/pure-css-animated-svg-circle-chart/#part-4-internet-explorer-strikes-back).
 */
.circle-chart__circle--negative {
  transform: rotate(-90deg) scale(1,-1); /* 1, 2, 3 */
}

.circle-chart__info {
  animation: circle-chart-appear 2s forwards;
  opacity: 0;
  transform: translateY(0.3em);
}

.circle-chart__percent{
  fill: #09B6CD;
  font-size: 7px;
  font-weight: 300;
}

@keyframes circle-chart-fill {
  to { stroke-dasharray: 0 100; }
}

@keyframes circle-chart-appear {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.graphs {
  display: flex;
  justify-content: space-around;
  align-content: center;
  align-items: center;  
  width: 100%;
  margin-top: 60px;
}

.graph-info{
  margin-top: 24px;
  font-size: 14px;
  color: #616161;
  text-align: center;
}

@media (min-width: 31em) {
  .grid {
    grid-template-columns: repeat(2, 1fr);
  }
}