body{
    background-image: url("https://www.talentedpeoplenow.com/JMCqkLcDW3aw");
    background-size:auto;
    background-repeat: no-repeat;
   margin: 0px;
   height: auto;
   width: auto;
} 
.dhea{

    display: flex;
    flex-direction: row;
    justify-content:space-between;
    background-color: black;
    width: auto;
    height: auto;
    

}

    


 h4{

    color: white;
    font-size: 30px;
 }

hdi{
    height: 300px;
}

.dico{
    cursor: pointer;
}

 .dcen{

    display: flex;
    flex-direction: row;
    justify-content: center;
    width: auto;
    height: auto;
   
 }



  .dceno{

    display: flex;
    flex-direction: column;
    justify-content: center;
    width: auto;
    height: auto;
   
   
 }
 .tittoppad{
    padding: 15px;
    color: white;
    font-family: -apple-system,  Roboto, Oxygen;
    font-style: italic;
 }
 .dsep{
    width: 25px;
 }
 .mopt{
    display: flex;
    flex-direction: row;
    justify-content: center;
    background-color: black;
    visibility: hidden;
   
 }
li{
    color:yellow;
    font-size: 16px;
    padding: 3px;
    display: inline;
    cursor: pointer;
}


/*one*/
 .fdes{
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    margin-left: 15px;
    box-shadow: -5px 0px 10px black;

}
.bdes{
    width: 100%;
    height: 100%;
    position: relative;
    transition: transform 0.7s;
    transform-style: preserve-3d;

}
.fdes:hover .bdes{

    transform: rotateY(180deg);
}

.fim, .bim{
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    

}
.fim{
    background-image: url('https://www.talentedpeoplenow.com/FM7fdk6VXGgz');
    background-size: cover;
    background-repeat: no-repeat;
    width: 400px;
    height: 300px;

}
.bim{
    background-image: url('https://www.talentedpeoplenow.com/k4r5y27mGxAe');
    background-size: cover;
    background-repeat: no-repeat;
    width: 400px;
    height: 300px;
    transform: rotateY(180deg);

}

/*two*/
 .fdestw{
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    margin-left: 15px;
    box-shadow: -5px 0px 10px black;

}
.bdestw{
    width: 100%;
    height: 100%;
    position: relative;
    transition: transform 0.7s;
    transform-style: preserve-3d;

}
.fdestw:hover .bdestw{

    transform: rotateY(180deg);
}

.fimtw, .bimtw{
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    

}
.fimtw{
    background-image: url('https://www.talentedpeoplenow.com/Ya3zxtgDeuRd');
    background-size: cover;
    background-repeat: no-repeat;
    width: 400px;
    height: 300px;

}
.bimtw{
    background-image: url('https://www.talentedpeoplenow.com/XS2D8n6r54PC');
    background-size: cover;
    background-repeat: no-repeat;
    width: 400px;
    height: 300px;
    transform: rotateY(180deg);

}
/*three*/
.fdesth{
    background-color: transparent;
    width: 400px;
    height: 300px;
    perspective: 1000px;
    margin-left: 15px;
    box-shadow: -5px 0px 10px black;

}
.bdesth{
    width: 100%;
    height: 100%;
    position: relative;
    transition: transform 0.7s;
    transform-style: preserve-3d;

}
.fdesth:hover .bdesth{

    transform: rotateY(180deg);
}

.fimth, .bimth{
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    

}
.fimth{
    background-image: url('https://www.talentedpeoplenow.com/XCEfT8cP4F3A');
    background-size: cover;
    background-repeat: no-repeat;
    width: 400px;
    height: 300px;

}
.bimth{
    background-image: url('https://www.talentedpeoplenow.com/Dur5myLE4dJX');
    background-size: cover;
    background-repeat: no-repeat;
    width: 400px;
    height: 300px;
    transform: rotateY(180deg);

}

.dlef{
    visibility: hidden;
}

.drig{
    visibility: hidden;
}


.dend{

     text-align: center;
    color: white;
    font-size: 21px;
    font-style: italic;
    font-family: -apple-system, sans-serif;

}
a{

    text-align: left;
    color: yellow;
    text-decoration: none;
    font-size: 16px;
    padding-left: 10px;
    cursor: pointer;
}
.dcnt{

    background-color: #055c9d;
    font-style: italic;
    font-size: 16px;
    padding: 5px;
    height:auto;
    width: auto;
}



@keyframes slver{

}

@media screen and ((max-width:430px)){

.dcen{

    display: flex;
    flex-direction: column;
    justify-content: center;
    gap:20px;
   

}





.fdes{
    width: 340px;
    height: 250px;
}
.fim{

    width: 340px;
    height: 250px;
    background-size: contain;
}
.bim{
    width: 340px;
    height: 250px;
    background-size: contain;
}





.fdestw{
    height: 250px;
   width: 340px;
}




.fimtw{
width: 340px;
height: 250px;
   background-size: contain;
}
.bimtw{
width: 340px;
height: 250px;
background-size: contain;
}


.fdesth{
    height: 250px;
    width:340px
}
.fimth{
    width:340px;
    height: 250px;
       background-size: contain;
}
.bimth{
    width: 340px;
    height: 250px;
       background-size: contain;
}





}

.dceno{
    display: flex;
    flex-direction: row;
    justify-content: center;
}




@media screen and ((max-width:1024px)){

.dcen{

    display: flex;
    flex-direction: column;
    justify-content: center;
    gap:10px;
    
 

}

}