:root{
  --primary-font: 'Inter', sans-serif;
  --col1: #0b538a;
  --col2: #0c8fe2;
  --color-w: #fff;
  --color-b: #353535;
  --col1-f: #c8d7e2;
  --col1-ef: #f3f6f9;
  --col2-f: #cee9f9;
  --col2-ef: #e6f4fc;
  --col-text: #565656;
  --col-text-faded: #8c8c8c;
  --col-subtext: #a6b8c8;
  --grad: linear-gradient(90deg, var(--col1) 0%, var(--col2) 100%);
  --grad-btn: linear-gradient(90deg, var(--col1) 0%, var(--col2) 50%, var(--col1) 100%);
  --trns: .4s cubic-bezier(0, 0.275, 0.125, 1);
}

body {
  font-family: var(--primary-font);
}

h1, h2 {
  width: fit-content;
    background: var(--grad);
    letter-spacing: 0px;
    font-weight: 700;
    color: transparent;
    -webkit-background-clip: text;
    margin-bottom: 28px !important;
    -webkit-text-fill-color: transparent;
}
h1[style="text-align: center;"], h2[style="text-align: center;"] {
  margin: 0 auto;
}
p {
  color: var(--col1);
  letter-spacing: .5px;

}

p strong{
  color: var(--col2);
}
#header {
  padding: 64px 0px 0px;
  position: relative;
}
#header::before{
  content: '';
  width: calc(( 100% - 1140px ) / 2 + 1140px + 70px);
  right: 0px;
  top: 39px;
  height: 105px;
  background: var(--grad);
  position: absolute;
  border-radius: 100px 0 0 100px;
}
#header::after{
  content: '';
  width: 70%;
  right: 0px;
  bottom: 0px;
  height: 50%;
  background: radial-gradient(farthest-side at 70% 100%, var(--col1-f), transparent );
  position: absolute;
}
#header .x-img {
  margin-right: -170px;
    margin-top: -30px;
}

#sco-logo img{
  width: 210px;
}
#header-bar{
  background: var(--grad);
}
#sco-logo{
  border-right: 2px #10568b solid;
  margin-right: 10px;
}
#header-bar p{
  font-size: .9em;
}
.modal-content > .boxed {
  border-radius: 10px;
}
#header-bar p, #header-bar p strong{
  color: var(--color-w);
  line-height: 1.5em;
}

.x-btn {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff;
  background: var(--grad-btn);
  background-size: 200%;
  background-position: left;
  transition: var(--trns);
  padding: 13px 46px 10px;
  border-radius: 5px;
  line-height: 36px;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
  user-select: none;
  outline: none;
  border: none;
}
.x-btn-clean {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--col1);
  background: transparent;
  transition: var(--trns);
  padding: 13px 46px 10px;
  border-radius: 5px;
  line-height: 36px;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
  box-shadow: inset 0 0 0 2px var(--col1-f);
  user-select: none;
}
.x-btn-white {
  color: #fff;
  background: transparent;
  box-shadow: inset 0 0 0 2px #fff;
}
.x-btn-clean:hover, .x-btn-clean:focus-within {
  background: var(--col1-f);
  color: var(--col1);
  text-decoration: none;
  box-shadow: inset 0 0 10px 2px var(--col1-f);
}


.x-btn:hover, .x-btn:focus-within, .x-btn:focus {
  background-position: right;
  color: #fff;
  text-decoration: none;
}

.x-btn-white:hover, .x-btn-white:focus-within {
  background: #fff;
  color: var(--col1);
  box-shadow: inset 0 0 10px 2px #fff;
}

.x-ripple{
  overflow: hidden;
  position: relative;
}
.x-ripple span{
 pointer-events: none;
}
.x-rip{
  position: absolute;
  background: #000;
  transform: translate(-50%, -50%);
  pointer-events: none;
  border-radius: 50%;
  animation: explodeX 1s ease;
  /* filter: blur(3px); */
}

.x-btn-clean .x-rip{
  background: var(--col1);
}

@keyframes explodeX {
  0%{
    width: 0px;
    height: 0px;
    opacity: 0.2;
  }
  100%{
    width: 350px;
    height: 350px;
    opacity: 0;
  }
}

.subtext{
  font-size: 14px;
  color: var(--col-subtext);
  margin-top: -30px;
  max-width: 290px;
  line-height: 1.8em;
  margin-bottom: 55px !important;
}


/* STEPS */


.x-circle > .wpb_wrapper {
  position: relative;
  width: 155px;
  height: 155px;
  margin: 0 auto;
}
.step .x-circle > .wpb_wrapper:before {
  content: '';
  position: absolute;
  width: calc(100% + 20px);
  height: calc(100% + 20px);
  border-radius: 50%;
  top: -10px;
  left: -10px;
  transform: scale(1.2);
  transform-origin: center;
  opacity: 0;
  transition: var(--trns);
  background: var(--col2-ef);
}
.step:hover .x-circle > .wpb_wrapper:before {
  transform: scale(1);
  opacity: 1;
}
.x-circle > .wpb_wrapper > p {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0px;
  height: 155px;
 }
.x-circle img {
  position: absolute;
  margin-bottom: 0px;
}

.x-circle svg {
  position: absolute;
  width: 100%;
  top: 0px;
  left: 0px;
}

.x-circle svg.wp-image-26{
  position: absolute;
  width: calc(100% - 2px);
  top: 1px;
  left: 1px;
}

.x-circle svg.wp-image-26 .cls-1 {
  fill: none;
  stroke: #cee9f9;
  stroke-miterlimit: 10;
  stroke-width: 1px;
}

.x-circle svg.wp-image-30 .cls-1 {
  --prop: 502px;
    stroke-dasharray: var(--prop);
    stroke-dashoffset: var(--prop);
    stroke-width: 2px;
    transform: rotate(90deg);
    transform-origin: center;
}
.x-circle img.wp-image-30 {
  opacity: 0;
  }


.x-circle.first svg.wp-image-30 .cls-1 {
  animation: firstStep 1s 1s ease both;
}

.x-circle.second svg.wp-image-30 .cls-1 {
  animation: secondStep 1.5s 1s ease both;
}

.x-circle.third svg.wp-image-30 .cls-1 {
  animation: thirdStep 2s 1s ease both;
}

.x-circle.fourth svg.wp-image-30 .cls-1 {
  animation: fourthStep 2.5s 1s ease both;
}

@keyframes firstStep {
  0%{stroke-dasharray: var(--prop);}
  100%{stroke-dasharray: calc( var(--prop) + var(--prop) * .25 );}
}

@keyframes secondStep {
  0%{stroke-dasharray: var(--prop);}
  100%{stroke-dasharray: calc( var(--prop) + var(--prop) * .50 );}
}

@keyframes thirdStep {
  0%{stroke-dasharray: var(--prop);}
  100%{stroke-dasharray: calc( var(--prop) + var(--prop) * .75 );}
}

@keyframes fourthStep {
  0%{stroke-dasharray: var(--prop);}
  100%{stroke-dasharray: calc( var(--prop) + var(--prop) * 1 );}
}

.x-circle .line {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 95%;
  height: 1px;
  transform: translate(-50%, -50%) rotate(-90deg);
}

.x-circle .line .traker{
  --size: 20px;
  position: absolute;
  top: 50%;
  left: calc(0px - var(--size));
  transform: translateY(-50%) rotate(90deg);
  width: calc(var(--size) * 2);
  height: calc(var(--size) * 2);
  background: var(--col2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  color: #fff;
 }

 /* .x-circle.first .line {
  animation: firstStepNr 1s 1s linear both;
 }

 .x-circle.first .line .traker {
  animation: firstStepNr2 1s 1s linear both;
 }

 .x-circle.second .line {
  animation: secondStepNr 2s 1s linear both;
 }

 .x-circle.second .line .traker {
  animation: secondStepNr2 2s 1s linear both;
 }

 .x-circle.third .line {
  animation: thirdStepNr 3s 1s linear both;
 }

 .x-circle.third .line .traker {
  animation: thirdStepNr2 3s 1s linear both;
 }

 .x-circle.fourth .line {
  animation: fourthStepNr 4s 1s linear both;
 }

 .x-circle.fourth .line .traker {
  animation: fourthStepNr2 4s 1s linear both;
 }


 @keyframes firstStepNr {
   0%{transform: translate(-50%, -50%) rotate(-90deg);}
   100%{transform: translate(-50%, -50%) rotate(0deg);}
 }

 @keyframes firstStepNr2 {
  0%{transform: translateY(-50%) rotate(90deg);}
  100%{transform: translateY(-50%) rotate(0deg);}
}

@keyframes secondStepNr {
  0%{transform: translate(-50%, -50%) rotate(-90deg);}
  100%{transform: translate(-50%, -50%) rotate(90deg);}
}

@keyframes secondStepNr2 {
 0%{transform: translateY(-50%) rotate(90deg);}
 100%{transform: translateY(-50%) rotate(-90deg);}
}

@keyframes thirdStepNr {
  0%{transform: translate(-50%, -50%) rotate(-90deg);}
  100%{transform: translate(-50%, -50%) rotate(180deg);}
}

@keyframes thirdStepNr2 {
 0%{transform: translateY(-50%) rotate(90deg);}
 100%{transform: translateY(-50%) rotate(-180deg);}
}

@keyframes fourthStepNr {
  0%{transform: translate(-50%, -50%) rotate(-90deg);}
  100%{transform: translate(-50%, -50%) rotate(270deg);}
}

@keyframes fourthStepNr2 {
 0%{transform: translateY(-50%) rotate(90deg);}
 100%{transform: translateY(-50%) rotate(-270deg);}
} */

h4{
  font-size: 24px;
  font-weight: 700;
  line-height: 1.5em;
  color: var(--col1);
  margin-top: 40px;
}

.x-circle-text h4 a{
  color: var(--col2);
}

.x-section {
  padding: 65px 0 85px!important;
}

#steps {
  padding: 130px 0  65px!important;
}

.x-img {
  border-radius: 10px;
    overflow: hidden;
}

#problem-text ul{
  list-style: none;
  margin: 0 0 15px;
}

#problem-text ul li{
  padding: 15px 40px;
  color: var(--col1);
}

#problem-text ul li:nth-child(even){
  background: var(--col1-ef);
}

#problem-text > .wpb_wrapper{
  padding: 20px 0px 10px;
  background: #fff;
  box-shadow: 0 5px 35px #0b538a25;
  border-radius: 10px;
  overflow: hidden;
  margin-left: -40px;
  margin-right: -60px;
  z-index: 9;
  position: relative;
}

#problem-text .x-btn-clean{
  margin-right: 40px;
}

#problem-text h5 {
  padding: 0 40px;
  color: var(--col-text);
  font-weight: 400;
  margin-bottom: 20px;
  padding-top: 30px;
  border-top: 2px var(--col1-ef) solid;
}



#problem-text p {
  margin-bottom: 15px;
  transition: all 1s ease;
}

#problem-text p.beGone {
  margin-bottom: 0px;
  height: 0px;
  overflow: hidden;
}

#problem .col-sm-7  > .vc_column-inner {
  z-index: 2;
}
#problem-trigger.beGone{
  height: 0px;
  max-height: 0px;
    padding: 0;
    margin-bottom: 0px;
    transition: all 1s ease;

}
#problem-container.collapsed{
  overflow: hidden;
  
  height: 0px;
}

#problem-container.visible{
  height: var(--compHeight);
  transition: all 1s ease;
}
#problem h2 {
  margin-bottom: 40px !important;
}

#problem .x-img {
  margin-right: -50px;
}

#solution {
  background-color: var(--col1);
  background-image: url(https://bredent.smilecare.ro/wp-content/uploads/2021/01/sco_solutia-bg_img@2x.jpg);
  background-size: cover;
} 

.text-white p {
  color: #fff;
}
.text-white p strong{
  color: #fff;
}
.text-white h2 {
  color: #fff;
  -webkit-text-fill-color: #fff
}

#solution-logo > figure {
  display: block;
}

#solution-logo > figure > div{
  display: block;
}

#solution-logo img {
  width: 100%;
}

.x-text-box p{
  text-align: justify;
}

#solution .x-text-box {
  padding-right: 40px;
}

#solution .x-text-boxed {
  padding-left: 40px;
}

#solution h2 {
  margin-bottom: 15px !important;
}

#solution .pull-up {
  margin-top: -140px;
}

#solution{
  margin-top: 95px;
}

.x-text-boxed > .vc_column-inner{
  
  border-radius: 10px;
}
.x-text-boxed .wpb_text_column .wpb_wrapper{
  padding: 30px 38px;
}
.x-text-boxed .wpb_text_column:not(:last-child){
  border-bottom: 1px var(--col1-f) solid;
  background: #fff;
}
.x-text-boxed .wpb_text_column:first-child{
  border-radius: 10px 10px 0 0;
}

.x-text-boxed .wpb_text_column:last-child{
  border-radius: 0 0 10px 10px;
  background: #fff;
}
.x-text-boxed h4 {
  margin-top: 0px;
  position: relative;
}
.x-text-boxed h4:after {
  content: '';
  position: absolute;
  bottom: -12px;
  left: 0px;
  height: 3px;
  width: 70px;
  border-radius: 10px;
  background: var(--col2);
}
.x-text-boxed p {
  font-size: .85em;
  line-height: 1.7em;
}

#stages {
  padding-top: 135px !important;
}


#stages .x-img {
  margin-right: -28px;
}
#stages .x-text {
  padding-left: 55px;
}

#stages ul.stages-list {
  list-style-type: none;
  position: relative;
  margin-left: 0px;
  padding-left: 80px;
  margin-top: 56px;
}

#stages ul.stages-list .stepper{
  --insHeight: 70px;
  --insTop: -7px;
  display: block;
  position: absolute;
  overflow: hidden;
  width: 50px;
  top: -20px;
  left: 0px;
  height: calc(100% + 40px);
  background: var(--col2-ef);
  border-radius: 40px;
}

#stages ul.stages-list .stepper .marker{
  position: absolute;
  height: var(--insHeight);
  top: var(--insTop);
  left: 0px;
  transition: var(--trns);
  width: 100%;
}

#stages ul.stages-list .stepper .marker:before{
  content: '';
  position: absolute;
  height: 100%;
  top: 0px;
  left: 0px;
  width: 50%;
  transform-origin: center;
  transform: skewY(22deg);
  background: var(--col1);
}

#stages ul.stages-list .stepper .marker::after{
  content: '';
  position: absolute;
  height: 100%;
  top: 0px;
  right: 0px;
  width: 50%;
  transform-origin: center;
  transform: skewY(-22deg);
  background: var(--col1);
}

#stages ul.stages-list li {
  display: block;
  position: relative;
  color: var(--col-text-faded);
  transition: var(--trns);
  font-weight: 600;
}
#stages ul.stages-list li.active {
  color: var(--col1);
}
#stages ul.stages-list li .step-no{
  position: absolute;
  left: -60px;
  z-index: 1;
  font-weight: 700;
  transition: var(--trns);
  color: var(--col1);
}
#stages ul.stages-list li.active .step-no{
  color: #fff;
}

#stages ul.stages-list li:not(:nth-child(6)) {
  padding-bottom: 20px;
}

.pachet > .vc_column-inner {
  padding: 35px 32px 30px !important;
  border-radius: 10px;
  box-shadow: 0 5px 35px #0b538a25;
  transition: var(--trns);
}
.sub-pachet > .vc_column-inner {
  padding: 30px 32px 30px !important;
  border-radius: 10px;
  box-shadow: 0 5px 35px #0b538a25;
  transition: var(--trns);
  background: var(--grad);
  margin-top: 30px;
}
.sub-pachet .wpb_text_column > .wpb_wrapper {
  display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.sub-pachet .wpb_text_column > .wpb_wrapper h3{
  color: #fff;
  font-size: 1.585714em;
  margin-bottom: 0px;
  width: min-content;
}

.sub-pachet .wpb_text_column > .wpb_wrapper p{
  color: #fff;
  font-size: 18px;
  line-height: 1.5em;
  font-weight: 400;
  margin-bottom: 0px;
  margin-left: 40px;
  max-width: 350px;
}

.sub-pachet ul.individual-offers {
  list-style-type: none;
  display: flex;
  margin: 0 0 0 auto!important;
}
.sub-pachet ul.individual-offers li {
  border-radius: 5px;
  border: 2px #fff solid;
  padding: 15px 20px;
  color: #fff;
  max-width: 210px;
  font-size: 18px;
  line-height: 1.6em;
  transition: var(--trns);
}
.sub-pachet ul.individual-offers li:hover {
  box-shadow: 0 5px 35px #0b538a25;
  transform: translateY(-5px);
}
.sub-pachet ul.individual-offers li:nth-child(2) {
  max-width: 194px;
  margin-left: 20px;
}

.pachet:hover > .vc_column-inner {
  box-shadow: 0 8px 38px #0b538a45;
  transform: translateY(-5px);
}

.pachet.--popular > .vc_column-inner {
  box-shadow: 0 5px 35px #0c8fe235, 0 0 0 2px var(--col2);
  position: relative;
}

.pachet.--popular:hover > .vc_column-inner {
  box-shadow: 0 10px 40px #0c8fe265, 0 0 0 2px var(--col2);
  position: relative;
}

.pachet.--popular > .vc_column-inner:after {
  content: 'POPULAR';
  background: var(--col2);
  color: #fff;
  font-family: 'Inter';
  font-weight: 600;
  letter-spacing: 1.5px;
  font-size: 12px;
  line-height: 25px;
  padding: 1px 25px 0px;
  border-radius: 20px;
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
}

.pachet h3 {
  color: var(--col1);
  font-size: 1.585714em;
  margin-bottom: 15px;
}

.pachet ul  {
  list-style: none !important;
  margin: 0px;
}

.pachet ul li  {
  list-style: none !important;
  margin: 0px;
  line-height: 1.5em;
  padding: 8px 0px;
  font-size: 18px;
  color:  var(--col1);
}

.pachet ul li:nth-child(even)  {
  margin: 0px -32px;
  padding: 8px 32px;
  background: var(--col1-ef);
}

.prices-holder > .wpb_wrapper > p {
  display: flex;
  margin-top: 28px;
  justify-content: flex-end;
}

.prices-holder .new-price {
  font-size: 33px;
  font-weight: 700;
  margin-left: 15px;
  color: var(--col2);
}

.prices-holder .old-price {
  position: relative;
  color: var(--col2);
}

.prices-holder .old-price:after {
  content: '';
  position: absolute;
  width: 106%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(8deg);
  height: 2px;
  background: var(--col2);
  box-shadow: 0 2px 0 0px #fff;
}

#healthy .wpb_single_image{
  text-align: right;
  width: fit-content;
  margin: 0 0 0 auto;
}

.x-text-check ul {
  list-style: none;
  margin: 0px;
}

.x-text-check ul li{
  padding-left: 45px;
  display: block;
  position: relative;
  color: var(--col1);
  margin-bottom: 10px;
}

.x-text-check ul li:before{
  width: 23px;
  height: 30px;
  content: '';
  position: absolute;
  background: url(https://bredent.smilecare.ro/wp-content/uploads/2021/01/sco_check.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  top: 2px;
  left: 0px;
}
#about {
  padding-top: 130px !important;
}
#about .x-img {
  width: fit-content;
}
#healthy {
  padding-bottom: 120px !important;
}
.testimonial {
  overflow: visible;
}
.testimonial > .vc_column-inner{
  padding: 32px 30px !important;
  border-radius: 10px;
  box-shadow: 0 5px 35px #0b538a25;
  transition: var(--trns);
} 
.testimonial > .vc_column-inner:hover {
  box-shadow: 0 8px 40px #0b538a45;
  transform: translateY(-5px);
}
.testimonial .test-text p {
  font-size: 18px;
  font-weight: 400;
  margin-bottom: 25px;
}

.test-author{
  padding: 25px 30px 0px;
  margin: 0 -30px;
  border-top: 1px var(--col1-f) solid;
}
.test-author img {
  width: 60px;
  height: 60px;
  border-radius: 50% !important;
  margin-bottom: 0px !important;
  margin-top: -6px !important;
  margin-right: 21px !important;
  box-shadow: 0 0 0 3px var(--col2), inset 0 0 0 2px #0c8fe2;
}
.test-author h3{
  font-size: 18px;
  color: var(--col2);
  margin-bottom: 5px;
  margin-top: 5px;
}

.test-author p {
  font-size: .7em;
  color: var(--col-text);
  line-height: 1em;
}

#bredent-logo img {
  width: 100%;
}

.bredent-item > .vc_column-inner > .wpb_wrapper {
  display: flex;
  align-items: center;
  margin-top: 40px;
}
.bredent-item .wpb_single_image {
  background: var(--grad);
  width: 110px;
  height: 110px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 30px;
}
.bredent-item img {
  height: 90px;
  width: 90px;
}

.bredent-item h4 {
  margin-top: 0px ;
}

.bredent-last > .vc_column-inner {
  margin-top: 65px !important;
  padding-top: 30px;
  border-top: 2px var(--col2-ef) solid;
}


.x-img-bredent.tweak .vc_single_image-wrapper{
  margin-left: -3px;
}

.x-img-cta {
  margin-right: -40px;
  margin-left: -40px;
  margin-bottom: -2px;
}
#cta-main{
  padding-top: 0px !important;
  padding-bottom: 0px !important;
  position: relative;
}
#cta-main:before{
  content: '';
  width: 100%;
  right: 0px;
  bottom: 0px;
  height: 50%;
  background: linear-gradient(0deg, var(--col1-f), transparent );
  position: absolute;
}
#cta-main .wpb_text_column{
  margin-bottom: 88px;
}

/* FORMULAR */
/* FORMULAR */
.form-box{
  border-bottom-right-radius: 59px;
  position: relative;
  display: flex;
  flex-flow: wrap;
  }

.input-box{
  width: 100%;
margin-top: 12px;
position:relative;
}

/* .input-box:nth-child(1){
width: 20%;
}

.input-box:nth-child(2){
width: 30%;
} */

.input-box input{
position: relative;
border-radius: 0px;
font-size: 18px;
line-height: 1.6em;
height: initial;
padding: 20px 0px 3px 0px;
margin-bottom: 10px;
color: var(--color-b)!important;
opacity: 1;
border: none;
border-bottom: 1px #dedede solid;
outline: none;
}

.s-sidebar .input-box input{
box-shadow: 0 0 18px 18px var(--color-w);
}

.input-box:before{
content: '';
z-index: 1;
display: block;
position: absolute;
left: 0px;
width: 0%;
height: 2px;
border-bottom: 1px var(--col2) solid;
bottom: 10px;
transition: all 0.5s cubic-bezier(0, 0.275, 0.125, 1);;
}

.input-box:hover:before{
width: 100%;
}
.input-box input{
background: transparent!important;
}

.input-box label{
font-size: 18px;
color: var(--color-b)!important;
opacity: 1;
padding: 10px 0px;
position: absolute;
top: 4px;
font-weight: 400;
left: 0px;
pointer-events: none;
transition: all 0.5s cubic-bezier(0, 0.275, 0.125, 1);;
}
.modal-container .modal-content {
  transform: translateZ(0) scale(1) perspective(1px) translate(-50%, -50%)!important;
  -webkit-transform: translateZ(0) scale(1) perspective(1px) translate(-50%, -50%)!important;
  backface-visibility: hidden;
  -webkit-font-smoothing: subpixel-antialiased;
  height: 670px !important;
  width: 640px !important;
}

.input-box input:focus-within ~ label,
.input-box input:focus ~ label,
.input-box input:valid ~ label{
top: -20px;
left: 0px;
color: var(--col1)!important;
font-size: 12px;
font-weight: 400;
}

.input-box input:focus-within,
.input-box input:focus{
border-bottom: 1px var(--col1) solid;
}

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active  {
  -webkit-box-shadow: 0 0 0 30px var(--color-w) inset !important;
  -webkit-text-fill-color: var(--color-b);
}

.input-box input:valid {
border-bottom: 1px #dedede solid!important;
}

.area-box{
width: 100%;
position: relative; 
}
.area-box textarea::placeholder{
color: var(--color-b);
font-size: 18px;


}
.area-box textarea {
color: var(--color-b);
  border: none;
  background: transparent;
  border-radius: 0px;
  border-bottom: 1px #dedede solid;
  font-size: 18px;
  line-height: 1em;
  padding-top: 20px;
  padding-left: 0px;
  transition: all 0.5s cubic-bezier(0, 0.275, 0.125, 1);
  max-height: 100px;
  min-height: 100px;
  min-width: 100%;
  font-weight: 400;
}

.area-box textarea:hover{
border-bottom: 1px var(--col1) solid;
}

.area-box textarea:focus-within,
.area-box textarea:focus{

border-bottom: 1px var(--col1) solid;
/* box-shadow: inset 0 5px 10px #00000020;  */
/* border-top: 1px var(--col1) solid;
border-bottom: 1px var(--col1) solid; */
}

.check-box input{
position: absolute;
left: -99999px;
} 

.check-box:not(:last-of-type){
margin-bottom: 12px;

text-align: left;
}
.modal-content h2{
  margin-bottom: 10px;
}
.check-box:last-of-type{
margin-bottom: 30px;
text-align: right;
width: 100%;
}

.check-box label {
  margin-top: 20px;
  position: relative;
  font-size: 14px;
  opacity: 1;
  line-height: 1.8em;
  padding-left: 30px;
  letter-spacing: .3px;
  text-align: left;
  transition: var(--transition-1);
  color: var(--color-b)!important;
}

.check-box:hover label{
opacity: 1;
}

.check-box label a{
color: var(--col1)!important;
text-decoration: none;
}
.check-box label a:hover{

text-decoration: underline;
}

.check-box label:before {
  content: '';
  width: 18px;
  height: 18px;
  margin-bottom: -3px;
  top: 3px;
  left: 0;
  margin-right: 10px;
  position: absolute;
  border: 1px #dedede solid;
  border-radius: 2px;
  display: inline-block;
  transition: all 0.5s cubic-bezier(0, 0.275, 0.125, 1);
}
.check-box input:checked ~ label:before{
  background-color: transparent;
  border: 1px transparent solid;
}

.check-box input:checked ~ label:after{
opacity: 1;
}

.check-box label:after{
content: '';
position: absolute;
width: 12px;
    height: 11px;
top: 7px;
left: 3px;
opacity: 0;
background-image: url(https://smilecare.ro/wp-content/uploads/2020/11/sc_check.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
display: inline-block;
filter: invert(20%) sepia(34%) saturate(3905%) hue-rotate(191deg) brightness(90%) contrast(88%);
transition: all 0.5s cubic-bezier(0, 0.275, 0.125, 1);;
}

.submit-box {
width: 100%;
}

.x-btn-form{
border: none!important;
height: unset!important;
margin-top: 9px;
}



/* FORMULAR */
#confirmation {
  background: var(--col1-f);
  min-height: 100vh;
}

.admin-bar #confirmation {
  min-height: calc(100vh - 32px);
}

.conf-holder > .vc_column-inner {
  max-width: 650px;
  padding: 60px 50px !important;
  box-shadow: 0 5px 35px #0b538a25;
  border-radius: 10px;
  margin: 0 auto;
  background: #fff;
}

.separator {
  height: 2px;
  background: var(--col2-ef);
  margin-bottom: 30px;
}


#steps .step > .vc_column-inner{
  position: relative;
}
#steps .step > .vc_column-inner:after{
  display: block !important;
  content: '';
  background: url(https://bredent.smilecare.ro/wp-content/uploads/2021/01/sco_pasi-trecere.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: -18px;
  right: -46px;
  height: 200px;
  width: 66px;
}
#steps .step:last-child > .vc_column-inner:after{
  display: none!important
}

@media (max-width: 770px){
  .x-section {
    padding: 55px 0 45px!important;
}
  body {
    font-size: 14px;
  }
  #header {
    padding: 0px 0px 0px;
  }
  #sco-logo {
    border-right: 0px #10568b solid;
    margin-right: 0px;
    margin-bottom: 20px;
    text-align: center;
  }
  #header-bar {
    background: none;
    background: var(--grad);
    margin-bottom: 40px;
    padding: 20px 0px;
}
#header::before {
  display: none;
}
#header .typed-headline p {
  line-height: 1.65em;
  text-align: center;
  padding: 0px 30px;
  font-size: 1em;
}
.x-btn, .x-btn-clean {
  font-size: 13px;
  padding: 13px 30px 10px;
  line-height: 23px;
}
.subtext {
  font-size: 12px;
  margin-top: -20px;
}
#steps {
  padding: 50px 0 20px!important;
}
.step > .vc_column-inner > .wpb_wrapper {
  display: flex;
  flex-flow: column-reverse;
}
.x-circle-text {
  margin-bottom: 35px;
}
.x-circle {
  margin-bottom: 90px;
}

#steps .step:last-child .x-circle {
  margin-bottom: 0px;
}
.x-circle svg.wp-image-30 {
  transform-origin: center;
  transform: scale(-1);
}
.x-circle .line .traker {
  transform: translateY(-50%) rotate(-90deg);
}
.x-circle .line {
  transform: translate(-50%, -50%) rotate(90deg);
}
#steps .step > .vc_column-inner:after{
  top: unset;
  right: unset;
  left: 50%;
  bottom: -70px;
  height: 200px;
  width: 66px;
  transform-origin: center;
  transform: translate(-50%) rotate(90deg);
}
#problem h2 {
  margin-bottom: 30px !important;
}

#problem-text > .wpb_wrapper {
  padding: 5px 0px 5px;
  margin-left: 0px;
  margin-bottom: 30px;
  margin-right: 0px;
}
#problem-text ul li {
  padding: 15px 20px;
  color: var(--col1);
}
#problem-text .x-btn-clean {
  margin-right: 30px;
}
h4 {
  font-size: 20px;
}
#problem .x-img {
  margin-right: 0px;
}
#solution .x-text-boxed {
  padding-left: 15px;
  margin-top: 40px;
}
#solution .x-text-box {
  padding-right: 15px;
}
#solution .vc_custom_1609731379342 {
  padding-bottom: 45px !important;
}
#solution .vc_custom_1609732289763 {
  margin-top: 35px !important;
}
#solution .vc_custom_1609731375208 {
  margin-bottom: 0px !important;
}
#solution .pull-up {
  margin-top: -120px;
}
#stages {
  padding-top: 75px !important;
}
#stages .x-img {
  margin-right: 0px;
}
#stages .vc_row {
  display: flex;
  flex-flow: column-reverse;
}
#about .vc_row {
    display: flex;
  flex-flow: column-reverse;
}
#stages .x-text {
  padding-left: 0px;
  margin-bottom: 60px;
}
#stages ul.stages-list .stepper {
  --insHeight: 60px;
}
#stages ul.stages-list {
  padding-left: 70px;
}
#stages ul.stages-list li .step-no {
 left: -50px;
}
#packs .vc_custom_1609752390833 {
  margin-bottom: 5px !important;
  padding: 0 30px !important;
}
.pachet > .vc_column-inner {
  margin-bottom: 40px;
}
.sub-pachet > .vc_column-inner {
  margin-top: 0px;
}
.sub-pachet .wpb_text_column > .wpb_wrapper {
  flex-flow: column;
}
.sub-pachet .wpb_text_column > .wpb_wrapper h3 {
  width: 100%;
  margin-bottom: 10px;
}
.sub-pachet .wpb_text_column > .wpb_wrapper p {
  margin-left: 0px;
  font-size: 14px;
  margin-bottom: 25px;
  max-width: 100%;
}
.sub-pachet ul.individual-offers {
  flex-flow: column;
  margin: unset !important;
}

.sub-pachet ul.individual-offers li {
  max-width: 100%;
  font-size: 16px;
  line-height: 1.6em;
}

.sub-pachet ul.individual-offers li:nth-child(1) {
  max-width: 100%;
  margin-left: 0px;
  margin-bottom: 15px;
  padding-right: 70px;
}
.pachet ul li {
  font-size: 14px;
}
.sub-pachet ul.individual-offers li:nth-child(2) {
  max-width: 100%;
  margin-left: 0px;
}
.pachet > .vc_column-inner {
  box-shadow: 0 5px 35px #0b538a25 !important;
  transform: none !important;
}
.pachet.--popular > .vc_column-inner {
  box-shadow: 0 5px 35px #0c8fe235, 0 0 0 2px var(--col2) !important;
  position: relative;
}


#first-cta{
  padding: 30px 0 20px !important;
}
#first-cta p{
  text-align: left !important;
}
#first-cta h2{
  text-align: left !important;
}
#healthy {
  padding-bottom: 80px !important;
}
#healthy .x-text{
  margin-bottom: 30px;
}
.x-text-check ul li {
  padding-left: 37px;
}
.x-text-check ul li:before {
  width: 23px;
  height: 12px;
  top: 5px;
}
#benefits .vc_custom_1609762334071 {
  margin-bottom: 0px !important;
}
#benefits{
  padding: 45px 0 45px!important;
}
#benefits h2 {
  padding-left: 37px;
  text-align: left !important;
  margin: 0 0 28px !important;
}
#about {
  padding-top: 60px !important;
}
#about .x-text {
  margin-bottom: 30px;
}
.testimonial > .vc_column-inner {
  margin-bottom: 30px;
}
#testimonials {
  padding-bottom: 0px !important;
}
#testimonials .vc_custom_1609762338563 {
  margin-bottom: 0px !important;
}
#bredent-logo {
  text-align: left;
}
#bredent-logo img {
  width: 70%;
}
.bredent-item .wpb_single_image {
  width: 80px;
  min-width: 80px;
  height: 80px;

}
.bredent-item img {
  height: 60px;
  width: 60px;
}  

#cta-main > .container > .vc_row {
  display: flex;
  flex-flow: wrap;
}
#cta-main > .container > .vc_row > .wpb_column:nth-child(1){
  width: 50%;
  order: 2;
}
#cta-main > .container > .vc_row > .wpb_column:nth-child(2){
  width: 100%;
  order: 1;
}
#cta-main > .container > .vc_row > .wpb_column:nth-child(3){
  width: 50%;
  order: 3;
}
#cta-main .wpb_text_column {
  margin-bottom: 38px;
}
.modal-container .modal-content {
  transform: translateZ(0) scale(1) perspective(1px) translate(-50%, -50%)!important;
  -webkit-transform: translateZ(0) scale(1) perspective(1px) translate(-50%, -50%)!important;
  backface-visibility: hidden;
  -webkit-font-smoothing: subpixel-antialiased;
  height: 610px !important;
  width: calc(100% - 30px) !important;
}
.modal-content h2 {
  margin-bottom: 10px;
  width: min-content !important;
}
.modal-container .modal-content > .modal-close-cross {
  background: #d51c1c;
  top: 3.238095em;
  right: 1.23809524em;
  opacity: 1;
}
.modal-content .boxed {
  padding: 23px 17px 17px;
}
.admin-bar #confirmation {
  min-height: calc(100vh - 46px);
}
#buttons-box .x-btn-clean {
  margin-left: 0px !important;
  margin-top: 5px;
}

#buttons-box{
  padding-top: 34px !important;
  background: linear-gradient(0deg, var(--col1-ef), transparent);
  margin-bottom: 50px;
  padding-bottom: 40px !important;
}
#cta-main .col-sm-3{
  margin-bottom: 0px !important;
}
.back-to-top{
  display: none !important;
}
#header-bar .col-sm-3{
  margin-bottom: 0px !important;
}
}