@import "colors.less";


a {
  text-decoration: none;
  &:hover {
    text-decoration: none;
  }
}
.dark {
  background: @dark;

  h1, h2, h3, h4, h5, h6 {
    color: @darkTitle;
  }

  p, span, a, li {
    color: @darkText;
  }

  .active {
    color: @darkActive;
  }


  .carousel-control-prev, .carousel-control-next {
    background: none;

    &:hover {
      background: none;
    }
  }
  a, button {
    background: @secondary;
    color: @secondaryTitle !important;
    cursor: pointer;
    text-decoration: none;
    border: none;
    &:hover {
      background: @secondaryHighlight;
      transition: 0.3s all;
      border: none;
    }
  }

  .link {
    background: none;
    border: 1px solid @light;
    color: @light !important;

    &:hover {
      background: @light;
      color: @lightText !important;
      border: 1px solid @dark;

    }
  }

}

.light {
  background: @light;

  h1, h2, h3, h4, h5, h6 {
    color: @lightTitle
  }

  p, span, a, li {
    color: @lightText !important;
  }


  a.active, button.active {
    background: @secondary !important;
    color: @secondaryTitle !important;
    &:hover {
      background: @dark !important;

    }
  }

  a, button {
    background: @dark;
    color: @darkText;
    cursor: pointer;
    margin-right: 10px;
    &:hover {
      color: @darkTitle !important;
      transition: 0.3s all;
    }
  }

  .link {
    background: none;
    border: 1px solid @dark;
    color: @dark;
    &:hover {
      background: @dark;
      color: @darkTitle !important;
      border: 1px solid @light;

    }
  }



}

.secondary {
  background: @secondary !important;
  color: @secondaryTitle !important;;


  h1, h2, h3, h4, h5, h6 {
    color: @secondaryTitle !important;
  }

  p, span, a, li {
    color: @secondaryText !important;
  }

  .active {
    color: @secondaryActive;
  }

  a, button {
    background: @secondary;
    color: @secondaryTitle !important;
    cursor: pointer;
    text-decoration: none;
    &:hover {
      background: @secondaryHighlight;
      transition: 0.3s all;
    }
  }


  .link {
    border: 1px solid @light;
    color: @secondaryTitle !important;;
    &:hover {
      border: 1px solid @secondaryHighlight;
    }
  }

}

.no-padding {
  padding: 0 !important;
}

.section {
  padding: 80px 10px;
}


.link {
  text-decoration: none;
  padding: 10px 15px;
  margin-top: 10px;
  display: inline-block;
  cursor: pointer;
  margin-bottom: 10px;
}

.owl-nav {
  font-size: 45px;
  text-align: right;

  button {
    margin-left: 10px;
    padding: 10px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
    outline: none !important;;
    border: none !important;;

    span {
      color: @darkActive;
      padding: 10px;
      border-radius: 50%;
      min-width: 40px;
      min-height: 40px;
      height: 40px;
      display: inline-flex;
      justify-content: center;
      align-items: center;
      margin-bottom: 5px;

    }
  }
}

.row {
  margin: 0;
}

.container-fluid {
  padding: 0;
}


.about {
  padding: 100px 10px;
}


.error {
  background: @dark;
  color: @darkText !important;
  padding: 5px 10px;
  margin-top: 10px;
  display: none;
}



.image-container-focused {
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.52);
  z-index: 3000;

  .image_holder {
    min-width: 100%;
  }

}

.image-container {
  display: flex;
  flex-direction: column;
  width: 100%;
  justify-content: flex-start;
  align-content: center;

  .image_holder {
    min-width: 100px;
    width: 100%;
    max-width: 100%;
    position: relative;;
    display: flex;

    &:hover {
      .image_tools {
        display: flex;
        cursor: pointer;
      }
    }

    img {
      width: 100px;
    }

    .image_tools {
      display: none;
      background: rgba(0, 0, 0, 0.5);
      position: absolute;;
      top: 0;
      width: 100px;
      height: inherit;
      bottom: 0;
      justify-content: center;
      align-items: center;

      span {
        color: white;
        border: 1px solid white;
        padding: 10px;
        border-radius: 50%;
      }

    }
  }

  .image_upload {
    text-align: center;
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 0 auto;

    .upload_action {
      display: none;
      p {
        background: none !important;
        outline: none;
        color: @light;
        border: 1px solid @light;
        padding: 10px;
        display: inline-block;
        margin-right: 10px;
        margin-top: 10px;
        cursor: pointer;
        transition: 0.3s all;
        &:hover {
          background: @dark !important;
          color: @darkText !important;
        }
      }
    }
  }
}

.image-text {
  display: flex;

  img {
    margin-right: 8px;
    width: 40px !important;
  }
}

.second-toolbar {
  display: none !important;
}

#template {
  display: none;
}