.bloc {
display: flex;
justify-content: space-around;
flex-wrap: wrap;
text-align: center;
justify-content: left;
}
.divBloc {
width: 200px;
padding-bottom: 50px;
}
.imgBloc {
height: 100px;
width: 100px;
border-radius: 20px;
}
.pBloc {
color: black;
font-weight: bold;
font-size: 18px;
}#carouselExampleIndicators {
max-width: 1024px;
width: 100%;
max-height: 768px;
height: 100%;
background-color: #fff;
overflow: hidden;
}
#carouselExampleIndicators > .carousel-inner {
height: 768px;
}
#carouselExampleIndicators > .carousel-inner > .carousel-item {
position: relative;
height: 100%;
}
#carouselExampleIndicators > .carousel-inner > .carousel-item > img {
max-width: 1024px;
max-height: 768px;
width: auto;
height: auto;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
left: 0;
right: 0;
margin: 0 auto;
} @media only screen and (max-width: 576px) {
#carouselExampleIndicators {
max-width: 96vw;
max-height: 72vw;
}
#carouselExampleIndicators > .carousel-inner {
height: 72vw;
}
#carouselExampleIndicators > .carousel-inner > .carousel-item > img {
max-width: 96vw;
max-height: 72vw;
}
} @media only screen and (min-width: 577px) and (max-width: 1024px) and (orientation : landscape) {
#carouselExampleIndicators {
max-width: 96vh;
max-height: 72vh;
}
#carouselExampleIndicators > .carousel-inner {
height: 72vh;
}
#carouselExampleIndicators > .carousel-inner > .carousel-item > img {
max-width: 96vh;
max-height: 72vh;
}
}