
#home-background {
    height: 100vh;
    background-color: #121721;
    font-family: 'Josefin Sans', sans-serif;
    color: white;
    text-align: center;
}

#home-ari {
    padding-top: 25%;
    font-size: 3em;
    letter-spacing: .3em;
    color: rgba(255, 255, 255, .9);
}

#home-role {
    letter-spacing: .3em;
    font-size: 1.3em;
    color: rgba(255, 255, 255, .8);
}

#home-profile {
    padding-top: 50px;
    padding-left: 12%;
    padding-right: 12%;
    font-size: 1.1em;
    letter-spacing: .02em;
    color: rgba(255, 255, 255, .6);
    font-family: 'Lato', sans-serif;
    font-weight: 300;
}

#home-image{
    height: 100vh;
    overflow: hidden;
    padding: 0px;
}

#home-image img{
    height: 100vh;
    float: right;

}

/* THE FOLLOWING CODE COPY PASTED FROM 
https://www.codeply.com/go/LhLJlldsLN/bootstrap-4-carousel-fade BY SKELLY
*/


.carousel-fade .carousel-item {
 opacity: 0;
 transition-duration: .6s;
 transition-property: opacity;
}

.carousel-fade  .carousel-item.active,
.carousel-fade  .carousel-item-next.carousel-item-left,
.carousel-fade  .carousel-item-prev.carousel-item-right {
  opacity: 1;
}

.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-right {
 opacity: 0;
}

.carousel-fade  .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-prev {
 transform: translateX(0);
 transform: translate3d(0, 0, 0);
}

/*END OF COPY PASTED CODE*/

