/* -----  Variables ------- */
/* -----   Mixins   ------- */
/* ----- Global CSS ------- */
body {
  background: #f1f3f5;
  font-family: Roboto, sans-serif;
  font-weight: 400; }

a {
  color: #00b7c4; }

a:hover {
  color: #039890; }

a:hover,
a:focus {
  text-decoration: none; }

.boxshadow-2 {
  box-shadow: 0 1px 10px rgba(0, 183, 196, 0.1); }

.boxshadow-4 {
  box-shadow: 0 1px 20px rgba(0, 183, 196, 0.1); }

.bg-custom {
  background-color: #00b7c4; }

/* -----   Navbar  ------- */
.navbar .nav-item {
  line-height: 1em; }
  .navbar .nav-item .nav-link {
    color: #fff; }
.navbar .navbar-toggler:focus {
  outline: none; }

@media (min-width: 768px) {
  .navbar .nav-item .nav-link {
    position: relative; }
    .navbar .nav-item .nav-link:before {
      transition: all ease 0.2s;
      width: 0;
      height: 1px;
      background: #fff;
      left: 50%;
      bottom: 0;
      content: '';
      position: absolute; }
    .navbar .nav-item .nav-link:hover:before {
      width: 100%;
      left: 0; } }
/* -----   Slider  ------- */
#slider {
  height: auto;
  width: 100%; }
  #slider .carousel-inner {
    height: 100%; }
    #slider .carousel-inner .carousel-item .slide {
      width: 100%;
      height: 100%;
      position: relative; }
      #slider .carousel-inner .carousel-item .slide img {
        object-fit: cover;
        width: 100%;
        height: 100%; }
      #slider .carousel-inner .carousel-item .slide .caption {
        animation: fadeInUp linear 0.5s;
        position: absolute;
        bottom: 40px;
        margin-right: 10%;
        padding: 10px;
        background: #5e5e5ea3;
        color: #fff;
        left: 10%;
        z-index: 1;
        text-transform: uppercase; }

/* -----   Articles  ------- */
.card-body .title .card-title {
  color: #00b7c4; }
.card-body .title:hover .card-title {
  color: #039890; }

/*  responsive  */
@media (min-width: 576px) {
  .card-columns {
    column-count: 1; } }
@media (min-width: 768px) {
  .card-columns {
    column-count: 2; } }
@media (min-width: 1200px) {
  .card-columns {
    column-count: 3; } }
@media (min-width: 1300px) {
  .card-columns {
    column-count: 4; } }
/* -----  Pagination  ------ */
.pagination .page-link {
  transition: all ease 0.3s;
  color: #00b7c4; }
  .pagination .page-link:hover {
    color: #fff;
    background-color: #00b7c4; }

/* -----  Footer  ------ */
.footer {
  color: #fff;
  padding: 10px; }
  .footer .social {
    padding: 0;
    list-style: none; }
    .footer .social li.nav-item a.nav-link {
      color: #fff; }
      .footer .social li.nav-item a.nav-link img.nav-svg-icon {
        width: 1rem;
        height: 1rem;
        padding-bottom: 2px; }
      .footer .social li.nav-item a.nav-link:hover {
        color: #fff; }
  .footer .footer-text {
    font-size: 0.7em; }

@media (min-width: 992px) {
  .footer .social li.nav-item {
    float: left; } }
@media (max-width: 768px) {
  a.nav-link {
    padding: 10px 0; } }
/* -----  Scroll to top  ------ */
.scrollDown {
  animation: fadeInDown 1s infinite;
  position: fixed;
  bottom: 80px;
  left: 50%;
  z-index: 999;
  text-align: center; }
  .scrollDown span.sroll-text {
    color: #00b7c4;
    font-size: 0.8em; }
  .scrollDown span.la {
    font-size: 1.2em;
    color: #00b7c4; }

/* -----  Scroll to top  ------ */
.scrollTop {
  position: fixed;
  display: none;
  bottom: 10px;
  right: 10px;
  z-index: 999;
  border-radius: 100%;
  border: 1px solid #00b7c4;
  width: 40px;
  height: 40px;
  background: #ffffffaa;
  line-height: 40px;
  text-align: center;
  font-size: 1em; }
  .scrollTop span {
    color: #00b7c4; }

/* -----  Animation  ------ */
.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both; }

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }
@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }
.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both; }

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0); }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }
@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0); }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

/*# sourceMappingURL=style.css.map */