/* CSS Document */
.display-none {
  display: none !important;
}

.hidden {
  opacity: 0 !important;
}

#content-start.hidden {
  opacity: 0;
  transition: all 1s ease-in-out;
}
#content-start .intro-text {
  opacity: 0;
}
#content-start .card {
  opacity: 0;
  transition: all 1s ease-in-out;
}
#content-start .card .card-title {
  opacity: 0;
  margin-bottom: -1rem;
  transition: all 1s ease-in-out;
}
#content-start.show {
  opacity: 1;
  /**/
  /**/
  /**/
}
#content-start.show .intro-text {
  opacity: 1;
  transition: all 1s ease-in-out;
  transition-delay: 0.4s;
}
#content-start.show .card {
  opacity: 1;
}
#content-start.show .card .card-title {
  opacity: 1;
  margin-bottom: 0;
  transition-delay: 8s;
}
#content-start.show .row :nth-child(2) .card {
  transition-delay: 0.11s;
}
#content-start.show .row :nth-child(3) .card {
  transition-delay: 0.27s;
}
#content-start.show .row :nth-child(4) .card {
  transition-delay: 0.44s;
}
#content-start.show .row :nth-child(5) .card {
  transition-delay: 0.55s;
}
#content-start.show .row :nth-child(6) .card {
  transition-delay: 0.66s;
}
#content-start.show .row :nth-child(2) .card-title {
  transition-delay: 0.4s;
}
#content-start.show .row :nth-child(3) .card-title {
  transition-delay: 0.6s;
}
#content-start.show .row :nth-child(4) .card-title {
  transition-delay: 0.8s;
}
#content-start.show .row :nth-child(5) .card-title {
  transition-delay: 0.9s;
}
#content-start.show .row :nth-child(6) .card-title {
  transition-delay: 1s;
}

/* mygallery */
#mygallery {
  /** /

  /**/
}
#mygallery .card {
  animation-name: fade-in;
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
  animation-direction: reverse;
}
#mygallery .card:nth-child(2) {
  animation-duration: 1.4s;
}
#mygallery .card:nth-child(3) {
  animation-duration: 1.8s;
}

@keyframes fade-in {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
#intro {
  position: absolute;
  width: 100%;
}
#intro .container {
  min-height: 500px;
  padding-top: 3em;
  padding-left: 4%;
}
#intro .container img {
  position: absolute;
  width: 60%;
  max-width: 600px;
  min-width: 400px;
  height: auto;
  margin: auto;
  opacity: 0 !important;
  transition: all 1s ease-in-out;
}

#intro.init2 img {
  opacity: 0.9 !important;
}
#intro.init2 img:first-child {
  transform: rotate(10deg);
}
#intro.init2 img:nth-child(2) {
  transform: rotate(-6deg);
  transition-delay: 0.14s;
}
#intro.init2 img:nth-child(3) {
  transform: rotate(4deg);
  transition-delay: 0.24s;
}
#intro.init2 img:nth-child(4) {
  transform: rotate(-12deg);
  transition-delay: 0.08s;
}
#intro.init2 img:nth-child(5) {
  transform: rotate(3deg);
  transition-delay: 0.1s;
}
#intro.init2 img:nth-child(6) {
  transform: rotate(-9deg);
  transition-delay: 0.2s;
}