
.img-top-content
    position: relative
    // width: 50%

.img-front
    max-height: 16rem
    opacity: 1
    display: block
    transition: .5s ease
    backface-visibility: hidden

.centered-content
    transition: .5s ease
    opacity: 0
    position: absolute
    top: 50%
    left: 50%
    transform: translate(-50%, -50%)
    text-align: center

.img-top-content:hover .img-front
    opacity: 0.6

.img-top-content:hover .centered-content
    opacity: 1

.card-title
    margin: 0px
    padding-top: 1rem

.modal-body
    padding: 2rem

.date
    justify-content: center
    padding: 1.5rem 0rem

.date-content
    font-weight: bolder
    text-align: center

@media (min-width: 576px)
    .modal-dialog 
        max-width: calc(100% - 15rem) !important
        margin: 1rem auto

.space
    min-height: 2rem

.algo
    color: #00f !important

.pad
    max-height: 8rem
    max-width: 7rem
    margin: 1rem 1.5rem

.side
    padding: 0.5rem
    border-radius: 0.3rem
    width: 100%

.launch
    padding: 1rem !important
    font-weight: bold
    margin-bottom: 1rem
    width: 100%

.project
    margin: 1rem auto

.shadow-effects
    box-shadow: 0rem 0rem 1.5rem rgba(0,0,0,0.4) !important

.para-content
    text-align: justify