.body {
     font-family: 'Shantell Sans', cursive; 
  


}

#content {
    outline: 3px ridge rgba(0, 0, 0222, 0.4);
    border-radius: 3%;
    display: flex;
    position: relative;
    left: 10vw;
    width: 60vw;
    padding: 0px;
    margin-top: 13px;
    height: 200px;
    transition: all 1s ease-in-out ;

}

.gros {
    font-size: 15px;
} 

#content:hover {

    left: 20vw;
    width: 60vw;
    outline: 5px ridge rgba(169, 24, 24, 0.96);
    border-radius: 3%;
    background-color: rgba(248, 246, 243, 0.687);
    color: black;

}

#content div {
    flex-basis: 30vw;

    text-align: center;

    border: 1px solid rgb(66, 34, 34);
    border-radius: 5px;
}

.bd {font-size: 3px;}

.box {
    flex-shrink: 2;

    background-image: linear-gradient(rgba(169, 207, 208, 0.5), rgba(131, 123, 29, 0.5));
    background-size: 99%;
    background-repeat: repeat;
    background-position: center;
    height: auto;
 
}

a {
    text-decoration: none;
    color: rgb(77, 14, 39);

}

a:hover {
    color: black;
   
}