@font-face {
  font-family: "Poppins";
  src:
    local("Poppins-Regular"),
    url("./fonts/Poppins-Regular.ttf") format("ttf");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Poppins-Bold";
  src:
    local("Poppins-Bold"),
    url("./fonts/Poppins-Bold.ttf") format("ttf");
  font-style: bold;
}
@font-face {
  font-family: "Poppins-SemiBold";
  src:
    local("Poppins-SemiBold"),
    url("./fonts/Poppins-SemiBold.ttf") format("ttf");
  font-style: bold;
}
@font-face {
  font-family: "BodyText-Regular";
  src:
    local("Body Text"),
    url("./fonts/BodyText-Regular.ttf") format("ttf");
  font-weight: 400;
  font-style: normal;
}

#miDiv {
    position: fixed;
    top: 0;
    width: 100%;
    background-color: #fff;
    /*color: #fff;
    padding: 10px; */
    margin-left: 0px;
    text-align: center;
    display: none;
    z-index: 9;
}

#miDiv.visible {
    display: inline-block;
}
body {
    /*background-image: linear-gradient(
      rgba(255, 255, 255, 0.70), 
      rgba(255, 255, 255, 0.70)
    ), url(../.././img/bg-2.jpg);*/
    background-image: url(../.././img/bg-2.jpg);
    background-attachment: fixed;
    background-size: cover;
    background-color: #fff;
    background-blend-mode: color;

}
body.home {

    background-color: initial;
    background-blend-mode: initial;

}

#main > div.row.align-middle {
  /* background-color: #fff; */
}
#main > div.row.align-middle .blanco{
  color: #fff
}
.inst {
  background-image: url(../.././img/bg-2.jpg);
    background-attachment: fixed;
}
.bg-footer{
    height: 300px;
    background: linear-gradient(rgba(249,249,249,.86),rgba(249,249,249,.86)),url(../.././img/background-mail_black.svg);
    background-color: #f9f9f9;
    background-size: cover;
}
.bg-footer p {
  padding: 6rem;
}
.slick-prev, .slick-next {
  top: 102% !important;
}
h1, h2 {
  font-family: "Poppins-Bold";
}
h3, h4, h5 {
  font-family: "Poppins-SemiBold";
}
body, p, span, li {
  font-family: "BodyText-Regular",;
}
html {
  scroll-behavior: smooth;
}
.sidebar {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  right: 0;
  background-color: #111;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
}

.sidebar a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 25px;
  color: #818181;
  display: block;
  transition: 0.3s;
}

.sidebar a:hover {
  color: #89cfe0;
}

.sidebar .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

.openbtn {
  font-size: 20px;
  cursor: pointer;
  background-color: #fff;
  color: #444;
  padding: 10px 15px;
  border: 1px solid #d9d9d9;
  border-radius: 15px;
}

.openbtn:hover {
  background-color: #89cfe0;
}

#main {
  transition: margin-right .5s;
  /*padding: 16px;*/
}
.card {
    margin: 5px auto;
}
.bigger {
  font-size: 50px;
}
.no-underline {
  text-decoration: none;
}
.justify-aligment {
  text-align: justify;
}
.card {
    filter: drop-shadow(0px 0px 3px #d1d1d1);
}
a.no-underline:hover .card {
    transform: scale(1.05);
    transition: .4s;
}
.icon:hover {
    transform: scale(1.05);
    transition: .4s;
    background-color: #fdfdfd;
    z-index: 1;
    filter: drop-shadow(0px 0px 2px #1616163d);
}

@media (min-width: 1024px) {
img.card-img-top.alto {
    max-height: 160px;
    height: 160px;
    object-fit: cover;
}
}
.img-manual {
    width: 100%;
    height: 60%;
}
.number-step-tutorial {
    float: left !important;
    left: -20px !important;
    top: 25px !important;
    z-index: 9;
}

.card-step-tutorial {
    top: -100px;
    height: 125px;
    clip-path: polygon(90% 0, 100% 50%, 90% 100%, 0% 100%, 10% 50%, 0% 0%);
}

.step > span {
    display: none;
}

.step,
.step:after {
    width: 72px;
    height: 72px;
    top: 36px;
    left: -250px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block;
}

.step {
    font-size: 36px;
    position: relative;
    line-height: 72px;
    text-align: center;
}

    .step:hover {
        transform: scale(1.2);
        transition: transform .3s linear,-webkit-transform .3s linear;
        transition-property: transform, -webkit-transform;
        transition-duration: 0.3s, 0.3s;
        transition-timing-function: linear, linear;
        transition-delay: 0s, 0s;
    }
    .step:after {
        content: "";
        border: 10px solid;
        border-radius: 50%;
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        transform: rotate(-45deg);
        position: absolute;
        left: 0;
        top: 0;
    }

.step-green {
    color: #88cfe0;
}

    .step-green:after {
        border-color: #3791a7 currentColor currentColor #3791a7;
    }

.step-orange {
    color: #88cfe0;
}

    .step-orange:after {
        border-color: #3791a7 currentColor currentColor #3791a7;
    }

.step-blue {
    color: #88cfe0;
}

    .step-blue:after {
        border-color: #3791a7 currentColor currentColor #3791a7;
    }

.preloader-animation {
    animation: fadeInAnimation ease 5s !important;
    animation-iteration-count: 1 !important;
    animation-fill-mode: forwards !important;
}

@keyframes fadeInAnimation {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}
.bg-gradient-white {
    background: #f5f5f5 linear-gradient(180deg,#f5f5f5,#f5f5f5) repeat-x!important;
    color: #1f2d3d;
}

.ani {
  --c: #89cfe0; /* the border color */
  --b: 5px;    /* the border thickness*/
  --g: 5px;     /* the gap on hover */
  
  padding: calc(var(--g) + var(--b));
  --_g: #0000 25%,var(--c) 0;
  background: 
    conic-gradient(from 180deg at top    var(--b) right var(--b),var(--_g))
     var(--_i,200%) 0  /200% var(--_i,var(--b))  no-repeat,
    conic-gradient(            at bottom var(--b) left  var(--b),var(--_g))
     0   var(--_i,200%)/var(--_i,var(--b)) 200%  no-repeat;
  transition: .3s, background-position .3s .3s;
  cursor: pointer;
}
.ani:hover {
  --_i: 100%;
  transition: .3s, background-size .3s .3s;
}
#miVentanaEmergente .card:hover {
    cursor: pointer;
}
@media (min-width: 1200px) {
  body {
    overflow-x: hidden;
  }
}
@media (max-width: 787px){
  .bg-trans{ 
    background-color #ffffff00 !important;
  }
  .icon {
    margin-bottom: 5px;
}
.mod-bg {
    background-position: center top;
}
.bg-footer{
    height: 500px;
    padding-top: 50%;
   /* background: linear-gradient(rgba(249,249,249,.86),rgba(249,249,249,.86)),url(../.././img/background-mail_black.svg);
    background-color: #f9f9f9;
    background-size: cover;*/
}
.logo-1, .logo-2 {
    width: 28% !important;
}
.direccion {
    padding: 15px 12% !important;
}

.direccion span {
    font-size: 16px !important;
}
.contacto span, .contacto a {
    font-size: 16px !important;
}
.mod-bg {
    padding-top: 45%;
}
#miDiv {
    padding-top: 30px;
}
.cus-padd {
   margin: 0 20px;
}
}
.openbtn {
  display: none;
}