/* google-fonts */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300;700&display=swap');

@font-face {
    font-family: 'BlenderPro';
    src: url(font/BlenderPro-Bold.woff);
}

body {
    background-color:#303030;
    font-family: 'Teko', sans-serif;
}
a{
    text-decoration: none;

}

img{
    filter:blur(20px);
}
/* header */
/* partie sous menu */
#navbar .menuContentParts li a {
    color: black;
}

#navbar .menuContentEquipement li a {
    color: black;
}

#navbar .menuContentParts li a:hover {
    color: black;
}

#navbar .menuContentEquipement li a:hover {
    color: black;
}

.miniMenuParts:hover .titleMenuParts, .miniMenuEquipement:hover .titleMenuEquipement {
    border-bottom: 2px solid rgb(255 216 0);
}

.miniMenuParts {
    position: relative;
}

.miniMenuParts::before {
    content: '';
    position: absolute;
    width: 159px;
    height: 32px;
    top: -32px;
    bottom: 0;
    left: 0;
}

.miniMenuParts::after {
    content: '';
    position: absolute;
    width: 159px;
    height: 32px;
    top: 27px;
    left: 0;
}

.menuContentParts {
    display: none;
    position: absolute;
    flex-direction: column;
    width: 17rem;
    list-style: none;
}

.miniMenuParts:hover .menuContentParts {
    display: flex;
    margin-top: 2rem;
    z-index: 2;
}

.miniMenuEquipement {
    position: relative;
}

.miniMenuEquipement::before {
    content: '';
    position: absolute;
    width: 130px;
    height: 32px;
    top: -32px;
    bottom: 0;
    left: 0;
}

.miniMenuEquipement::after {
    content: '';
    position: absolute;
    width: 130px;
    height: 32px;
    top: 27px;
    left: 0;
}

.menuContentEquipement {
    display: none;
    position: absolute;
    flex-direction: column;
    width: 17rem;
    list-style: none;
    margin-right: 2rem;
}

.miniMenuEquipement:hover .menuContentEquipement {
    display: flex;
    margin-top: 2rem;
    z-index: 2;
}

/* fin partie sous menu */
/* partie logo */
#logo {
    color: rgb(181, 181, 181);
    font-size: 2.8rem;
    text-decoration: none;
    min-width: 150px;
    padding: 0 5px;
    position: relative;
    color: rgb(255, 255, 255);
}

#logo:hover {
    transition: box-shadow 0.7s ease-in;
    transition: 0.7s ease-in-out;
    box-shadow: 0px 0px 0px 0px rgb(133 133 133);
    border-radius: 5px;
    background-color:#303030;
    color: rgb(92, 91, 91);
}

.logoSecondPart {
    color: #0091a9;
}

/* partie navbar  */
nav {
    background-color: RGBA(27, 27, 27,0%);
}
.titleEvent,.titleMenuEquipement,.titleMenuParts{
    position: relative;
}
.titleEvent::after{
    content: 'COMMING-SOON';
    color: #4c74ac;
    position: absolute;
    bottom: 13px;
    font-size: 10px;
    right: 0rem;
}
 .titleMenuEquipement::after {
    content: 'COMMING-SOON';
    position: absolute;
    top: -10px;
    right: 4%;
    font-size: 10px;
    color: #4c74ac;

}
.titleMenuParts::after{
    content: 'COMMING-SOON';
    position: absolute;
    top: -10px;
    right: 3%;
    font-size: 10px;
    color: #4c74ac;
}

#navbar li a {
    color: rgb(186, 185, 185);
    font-size: 1.1rem;
    text-decoration: none;
    font-family: 'BlenderPro';
    font-weight: 700;
    padding: 0rem 0.9rem;
}

#navbar {
    width: 100%;
}

#navbar li a:hover {
    color: #f3f3f3;
    border-bottom: 2px solid rgb(255 216 0);
}

.icon {
    font-size: 1.5rem;
    color: #22edbe;
    margin: 0 5px;
}
hr{
    background-color: rgb(255, 0, 0);
    height: 1px;
    opacity: 1;
}
/* fin du HEADER*/

/* section */
@media screen and (min-width:1200px) {
    .card{
        max-height: 271px;
    }
}

section {
    background-color: #303030;
}

.hideContent {
    display: none;
}

.showContent {
    display: flex;

}

.logo img {
    height: 100px;
  
}

.hover :hover{
transform: scale(1.02);
}
#blocPictures {
    margin-top: 5rem;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    padding: 0;
    position: relative;
    padding-bottom: 100px;
}

#blocPictures::after {

    content: '';
    width: 50px;
    height: 2px;
    background-color: #0091a9;
    position: absolute;
    bottom: 0;
    margin-top: 150px;
}

div#blocPictures img {
    padding: 10px;
  

}

.order1 {
    order: 1;
    transform: scaleY(1);
    transition: transform 0.5s ease-in-out;
}

.order2 {
    order: 2;
    transform: scaleY(1.5);
    transition: order 2s ease-in-out;
    transition: box-shadow 1s ease-in-out;
    /* box-shadow: 0px 30px 51px -15px black;  ---> v1 */
    box-shadow: 0px 28px 66px 0px black;
}

.order3 {
    order: 3;
    transform: scaleY(1);
    transition: transform 0.5s ease-in-out;
}

#bloc1 div .col-xl-6, #bloc2 div .col-xl-6, #bloc3 div .col-xl-6 {
    border-right: 2px solid #cccccc;
    margin: 100px 0px;
}




/* footer */
footer {
    background-color: RGB(27, 27, 27);
    padding: 0;
    border-top: 1px solid #4d4d4d;

}

footer a {
    text-decoration: none;
    color: #ebe7e7;
}

footer ul {
    list-style: none;
    font-size: 1.2rem;
}

footer ul li {
    margin: 5px 0px;
}

#copyrightText {
    color: #8b8b8b;
}

/* reseaux sociaux logo */
.réseauxSociaux img {
    width: 2em;
}

/* partie responsive */
/* reduction de la taille des titres et l\'adaptation du bloc home avec la photo   */

@media screen and (max-width:1350px) and (min-width:1164px) {
    #navbar i{
        font-size: 1.2rem;
    }
    
}
@media screen and (max-width:1163px) and (min-width:990px){
    #navbar i{
        font-size: 1rem;
    }
    
}

@media screen and (max-width:1350px) and (min-width:1221px) {
    #navbar ul li a {
        font-size: 0.9rem;
    }
    
}

@media screen and (max-width:1220px) and (min-width:1164px) {
    #navbar ul li a {
        font-size: 0.85rem;
    }
}
@media screen and (max-width:1163px) and (min-width:1061px) {
    #navbar ul li a {
        font-size: 0.70rem;
    }

}
@media screen and (max-width:1060px) and (min-width:990px) {
    #navbar ul li a {
        font-size: 0.60rem;
    }

}
/* partie affichage des moto par page */
#bloc{
   
    font-family: 'BlenderPro';
}
ul{
    list-style-type: none;
}
.title{
    text-decoration: underline;
}

.blocImg{
max-height:400px ;
max-width:500px ;
height: auto;
width: auto;

}
.descriptionBox{
    border-top:1px solid #5d5d5d;
    border-bottom:1px solid #5d5d5d;
}
.descriptionBox h1{
  font-size:4rem;
}