.carousel.vertical .carousel-inner > .item {
  transition: 0.6s ease-in-out top;
}

@media all and (transform-3d), (-webkit-transform-3d) {
  .carousel.vertical .carousel-inner > .item {
    transition: transform 0.6s ease-in-out;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -ms-perspective: 1000;
    perspective: 1000;
  }
  .carousel.vertical .carousel-inner > .item.next,
  .carousel.vertical .carousel-inner > .item.active.right {
    top: 0;
    transform: translate3d(0, 100%, 0);
  }
  .carousel.vertical .carousel-inner > .item.prev,
  .carousel.vertical .carousel-inner > .item.active.left {
    top: 0;
    transform: translate3d(0, -100%, 0);
  }
  .carousel.vertical .carousel-inner > .item.next.left,
  .carousel.vertical .carousel-inner > .item.prev.right,
  .carousel.vertical .carousel-inner > .item.active {
    top: 0;
    transform: translate3d(0, 0, 0);
  }
}
.carousel.vertical .carousel-inner > .active {
  top: 0;
}
.carousel.vertical .carousel-inner > .next,
.carousel.vertical .carousel-inner > .prev {
  top: 0;
  height: 100%;
  width: 100%;
}
.carousel.vertical .carousel-inner > .next {
  left: 0;
  top: 100%;
}
.carousel.vertical .carousel-inner > .prev {
  left: 0;
  top: -100%;
}
.carousel.vertical .carousel-inner > .next.left,
.carousel.vertical .carousel-inner > .prev.right {
  top: 0;
}
.carousel.vertical .carousel-inner > .active.left {
  left: 0;
  top: -100%;
}
.carousel.vertical .carousel-inner > .active.right {
  left: 0;
  top: 100%;
}
.carousel.vertical .carousel-indicators,
.carousel-indicators-vertical {
  right: 20px;
  top: 50%;
  transform: translate(-50%);
  bottom: auto;
  left: auto;
  width: auto;
  margin: 0;
  padding: 0;
}
.carousel.vertical .carousel-indicators li,
.carousel-indicators-vertical li {
  display: block;
  margin: 5px 0;
}


/* card */
/* .cad {
	background-color: var(--background);
	display: block;
	width: 300px;
	min-height: 90px;
	cursor: pointer;
	padding: 15px;
	margin: calc(50vh - 30px) auto 0 auto;
	border: 3px solid var(--primary);
	

  }
  
  .cad:hover {
	animation: shadow-wave 1s ease infinite;
  }
  
  
  @keyframes shadow-wave {
	0% {
	  border: 3px solid var(--primary);
	  box-shadow: 10px -10px 0 -3px var(--background), 10px -10px var(--green),

	}
	20% {
	  border: 3px solid var(--red);
	  box-shadow: 10px -10px 0 -3px var(--background), 10px -10px var(--primary),

	}
	40% {
	  border: 3px solid var(--orange);
	  box-shadow: 10px -10px 0 -3px var(--background), 10px -10px var(--red),

	}
	60% {
	  border: 3px solid var(--yellow);
	  box-shadow: 10px -10px 0 -3px var(--background), 10px -10px var(--orange),

	}
	80% {
	  border: 3px solid var(--green);
	  box-shadow: 10px -10px 0 -3px var(--background), 10px -10px var(--yellow),

	}
	100% {
	  border: 3px solid var(--primary);
	  box-shadow: 10px -10px 0 -3px var(--background), 10px -10px var(--green),

	}
	
  }
  
  :root {
	--primary: rgb(89, 184, 89);
	--secondary: #192824;
	--background: #192824;
	--green: rgb(89, 184, 89);
	--yellow: #FFD913;
	--orange: #FF9C55;
	--red: #FF5555;
  } 
  
  *{
	padding: 0;
	margin: 0;
	box-sizing: border-box;
  }
  
  .bdy {
	background-image: radial-gradient(var(--secondary) 30%, var(--background) 30%);
	background-size: 2px 3px;
	font-family: "Archivo", sans-serif;
	color: var(--primary);
  }
  
  .cad-p {
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin-bottom: 10px;
  }
  
  .cad-h2 {
	font-size: 14px;
	font-family: "Archivo Black", "Archivo", sans-serif;
	font-weight: normal;
  }

  .cad-h2:hover{
	  color: greenyellow;
  } */
  
  .bg-color{
	background-color: rgba(141, 141, 141, 0.753);
  }


  /* hr */
/* 
  hr {
    border: none;
    border-top: 3px double rgb(205, 230, 211);
    color: rgb(205, 230, 211);
    overflow: visible;
    text-align: center;
	height: 5px;
	width: 140px;
	margin-left: auto;
	margin-right: auto;
}

hr:after {
    background: rgba(0, 0, 0, 0);
    content: '§';
    padding: 0 4px;
    position: relative;
    top: -13px;
} */


/* medium+ screen sizes */
@media (min-width:992px) {
    .desktop-only {
        display:block !important;
    }
}
 
/* small screen sizes */
@media (max-width: 991px) {
    .mobile-only {
        display:block !important;
    }
 
    .desktop-only {
        display:none !important;
    }
}