@font-face {
  /**700**/
  font-family: Font-Bold;
  
  src: url("../fonts/Poppins-Bold.woff");
}

@font-face {
  /**600**/
  font-family: Font-Semibold;
  src: url("../fonts/Poppins-SemiBold.woff");
}
@font-face {
  /**500**/
  font-family: Font-Medium;
  src: url("../fonts/Poppins-Medium.woff");
}
@font-face {
  /**400**/
  font-family: Font-Regular;
  src: url("../fonts/Poppins-Regular.woff");
}

@font-face {
  /**400**/
  font-family: RobotoSerifRegular;
  src: url("../fonts/RobotoSerif_28pt-Regular.woff");
}
@font-face {
  /**300**/
  font-family: Font-Light;

  src: url("../fonts/RobotoSerif-Light.woff");
}
@font-face {
  /**300**/
  font-family: Font-ExtraLight;
  /* src: url('./assets/fonts/RobotoSerif-Light.woff'); */
  src: url("../fonts/RobotoSerif-ExtraLight.woff");
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
.space-mb-2-privacidad{
    margin-bottom: 4rem;
}
main{
  min-height: 80vh;
}
section{
  overflow: hidden;
}
html {
  scroll-behavior: smooth;
}
:root {
  --background-navbar: #ffffff;
  --background-navbar-movil: #ffffff;
  --background-menu-movil: #ffffff;
  --botones-2: #ffb701;

  --border:#E0E0E0;
  --principal:#0056B4;
}
/******nmavbar*****/

.d-none {
  display: none;
}

li{
    margin-left: 1rem;
}
img{
  width: 100%;
}
 .txt-blue{
   color:var( --principal);
     font-family: Font-Bold;
 }
/************/


.container {
  width: 90%;
  max-width: 1440px;
  margin: 0 auto;
}
a {
  color: inherit;
  text-decoration: none;
  font-family: "Arial, Helvetica, sans-serif";
}

/*****************/
h1{
  font-weight: inherit !important;
}

h2 {
  font-family: Font-Medium;  
  font-size: 48px;
  line-height: 60px;
  color: var(--principal);
  font-weight: inherit !important;
}
h3, .h3{
   font-weight: inherit !important;
    font-size: 40px;
    font-family: Font-Semibold;  
     color: var(--principal);
}
h4 {
  font-family: Font-Semibold;
  font-size: 36px;
  line-height: 64px;
  color: var(--principal);
  font-weight: inherit !important;
}
h5 {
  font-family: Font-SemiBold;
  font-size: 28px;
  line-height: 38px;
 color: var(--principal);
 font-weight: inherit !important;
}
h6 {
  font-family: Font-Semibold;
  font-size: 24px;
  line-height: 36px;
  color: var(--principal);
font-weight: inherit !important;
}

p {
  font-family: Font-Regular;
  line-height: 32px;
  font-size: 20px;
  line-height: 32px;
  color: #636569;
}

@media (max-width: 1024px) {
  h2 {
    font-size: 36px;
    line-height: 46px;
  }
  h3, .h3{   
    font-size: 32px;   
}
  h4 {
    font-size: 26px;
    line-height: 45px;
  }
  h5 {
    font-size: 26px;
    line-height: 34px;
  }
  h6 {
    font-size: 20px;
    line-height: 32px;
  }

  p {
    font-size: 18px;
    line-height: 26px;
  }
}

@media (max-width: 600px) {
  h2 {
  
    font-size: 28px;
    line-height: 44px;
  }
  h4 {
    
    font-size: 20px;
    line-height: 30px;
  }
  h5 {
 
    font-size: 22px;
    line-height: 28px;
  }
  h6 {
 
    font-size: 18px;
    line-height: 28px;
  }

  p {
    font-size: 16px;
    line-height: 24px;
  }
}

hr,
.hr {
  margin-bottom: 10px;
  margin-top: 10px;
  border-bottom: 1px solid var(--neutral300);
}


/******botones***********/
.btn :active,
.btn :hover,
.btn :focus {
  outline: 0 !important;
  outline-offset: 0;
}

.btn::before,
.btn::after {
  position: absolute;
  content: "";
}

.btn-holder {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 1000px;
  margin: 10px auto 35px;
}
.btn {
  position: relative;
  display: inline-flex;
  border: none;
  cursor: pointer;    
   border-radius: 40px;
}

.btn-1 {
  background: #0056B4;
  color: #fff;
}
.btn-2 {  
  background: #fafafa;
  color: #000000;
}
  .btn .hov {         
    position: relative;
    display: flex;
    column-gap: .5rem;
    font-size: 20px;
    top: 0; left: 0;
    width: 100%;
    padding: 12px 20px;
    transition: 0.3s;
     font-family: Font-Medium;
  }
  .navbar .btn .hov{
      font-size: 16px;
  }


.btn-1::before {
  background-color: transparent;
  transition: 
    width 0.3s ease-out,
    height 0.3s ease-out,
    top 0.3s ease-out,
    background-color 0.15s ease-out;
  border-radius: 40px;
}

.btn-2::before{
background-color: transparent;
  transition: 
    width 0.3s ease-out,
    height 0.3s ease-out,
    top 0.3s ease-out,
    background-color 0.15s ease-out;
  border-radius: 40px;
}
.btn-1 .hov {
  color: #ffffff;
  border: 1px solid #0056B4;
  border-radius: 40px;
  transition: 0.2s;
} 
.btn-2 .hov {
  color: rgb(28, 31, 30);
  border: 1px solid #ffffff;
   border-radius: 40px;
  transition: 0.2s;
 
}  
.btn-1 span:hover {
  color: #0056B4;
  transition: 0.2s 0.1s;
}
.btn-2 span:hover {
  color:#ffffff;
  transition: 0.2s 0.1s;
}

.btn.slide-right::before {
  top: 0; bottom: 0; left: 0; 
  height: 100%; width: 0%;
}

.btn.slide-right:hover::before {
  width: 100%;
}
.btn-1.slide-right:hover::before {
  width: 100%;
  height: 100%;
  top: 0;
  background-color: #ffffff;
}
.btn-2.slide-right:hover::before {
  width: 100%;
  height: 100%;
  top: 0;
  background-color: #000000;
}



.arrow img{
  transition: 0.2s;
}

.btn-1:hover .arrow img{
  content: url("../iconos/arrow-blue.svg");
}
.btn-2:hover .arrow-2 img{
  content: url("../iconos/arrow_cta.svg");
}
.arrow{
  display:inline-block;
  width:18px;
  height:18px;
  padding-top: 4px;
} 





@media (max-width: 1024px) {
    .btn .hov{
      font-size: 18px;
  }
}

@media (max-width: 768px) {
    .btn .hov{
      font-size: 16px;
      padding: 8px 20px;
  }
  .arrow{
  display:inline-block;
  width:16px;
  height:16px;
  padding-top: 2px;
} 

}
@media (max-width: 375px) {
    .btn .hov{
      font-size: 14px;
  }
}
/**********/
 .btn-conoce-mas {           
  margin:50px 0;            
  }
  @media screen and (max-width: 1024px) {
   .btn-conoce-mas{
    margin: 20px 0;
  }
  }

/********end botones***********/