@import url(color.css);
@import url(size.css);

html {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.project-img {
    width: 100% !important;
    aspect-ratio: 1/0.9;
}

.text-justify{
    text-align:justify
}


@media (max-width: 576px) {
    .text-align-left{
        text-align: left;
    }
    .text-align-center{
        text-align: center;
    }
}



@media (min-width: 576px) {
    .s-sm-2 {
        height: 80px;
    }

    .item {
        min-height: 23rem;
    }
}

@media (min-width: 768px) {
    .s-md-3 {
        height: 80px;
    }
    .item {
        min-height: 17.5rem;
    }
    .fs-md-4{
        font-size: calc(1.275rem + .3vw) !important;
    }
}

@media (min-width: 992px) {
    .s-lg-4 {
        height: 80px;
    }
    .item {
        min-height: 20rem;
    }
}

@media (min-width: 1200px) {
    .s-xl-5 {
        height: 90px;
    }
    .fs-xl-1{
        font-size: calc(1.375rem + 1.5vw)!important
    }
}

.scroll-id {
    scroll-margin-top: 123px;
}

.z-0 {
    z-index: 0;
}

.z-1 {
    z-index: 1;
}

.head-white {
    background-color: white !important;
    opacity: 0.8;
}
.text-justify-last{
    text-align-last:justify
}

.text-stroke {
  text-shadow: white 0px 0 15px;
}

.fs-05 {
    font-size: calc(1.5rem + 1.5vw) !important;
    -webkit-text-stroke: 2px;
}

.caption {
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: center;
    color: white;
    background-color: #222222;
    opacity: 0.9;
}

.left-button {
    left: 0;
}

.right-button {
    right: 0;
}

.owl-button {
    position: absolute;
    z-index: 2;
    color: white;
    top: 55%;
    transform: translateY(-50%);
    opacity: 0.7;
    cursor: pointer;
}

.pointer{
    cursor: pointer;
}

.owl-button:hover {
    opacity: 1;
}

.owl-carousel .owl-stage-outer:before {
    content: "";
    background: #fff;
    position: absolute;
    width: 100%;
    height: 700px;
    left: -100%;
    margin-left: -20px;
    top: 0;
    z-index: 10;
}

@keyframes flowing {
  from {
      padding-bottom: 0px;
  }
  to {
      padding-bottom: 7px;
  }
}

.moving{
    animation: flowing 0.7s linear 0s infinite alternate;
    z-index: 999!important;
}