.carousel-item img{
    width:100%;
    height:auto;
    max-height:70vh;
    aspect-ratio: 4/3;
    object-fit:cover
}
.modal{
    display:none;
    position:fixed;
    z-index:1050;
    padding-top:2%;
    left:0;
    top:0;
    width:100%;
    height:100%;
    overflow:auto;
    background-color:rgba(0,0,0,.95)
}
.modal-content{
    margin:auto;
    display:block;
    max-width:90vw;
    width:100%;
    position:relative
}
.modal-content img{
    width:100%;
    height:auto;
    max-height:90vh;
    object-fit:contain
}
.close{
    position:absolute;
    top:10px;
    right:20px;
    font-size:2.5rem;
    color:#fff;
    z-index:1060;
    background:0 0;
    border:none;
    cursor:pointer
}
.close:hover{
    color:#ccc
}
.next,.prev{
    cursor:pointer;
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    color:#fff;
    font-size:2rem;
    font-weight:700;
    padding:10px;
    z-index:1060;
    background-color:rgba(0,0,0,.6);
    border-radius:5px;
}
.prev{
    left:10px
}
.next{
    right:10px
}
.next:hover,.prev:hover{

}
.numbertext{
    color:#fff;
    font-size:14px;
    position:absolute;
    top:5px;
    left:10px
}
.carousel-control-next-icon,.carousel-control-prev-icon{
    width:3rem;
    height:3rem
}
@media screen and (max-width:767px){
    .carousel-item img{
        max-height:60vh;
        object-fit:cover
    }
    .modal-content img{
        max-height:80vh
    }
    .close{
        font-size:2rem;
        top:8px;
        right:12px
    }
    .next,.prev{
        font-size:1.5rem;
        padding:6px
    }
    .numbertext{
        font-size:12px;
        top:3px
    }
}
.equipement-item{
    padding:.5rem;
    border:1px solid #e0e0e0;
    border-radius:10px;
    font-size:.85rem;
    font-weight:600;
    box-shadow:0 2px 5px rgba(0, 0, 0, 0.247);
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    line-height:1.2;
    height:70px
}
