#nav{
    background-color: white;
}
.contentMini{
    font-size: 17px;
    color:black;
    text-shadow: 5px 5px 5px white;
}
.boxContent{
    overflow-y: scroll;
    height: 400px;
    width: 80%;
    /* background-color: rgb(184, 184, 184); */
    padding: 20px;
}
.AbouteSite>.container{
    display: flex;
    justify-content: space-evenly;
}
.ImgTop{
    width: 80%;
}
.collaction>.container{
    display: flex;
    margin-top: 40px;
    margin-bottom: 40px;
}
.oxotnichiyK{
    color: black;
    text-decoration: none;
}
.box{
    width: 40%;
    margin: 10px;
    padding: 10px;
    text-decoration: none;
    text-align: center;
    border: 1px solid gold;
    transition: .3s;
    border-radius: 10px;
}
.box:hover{
    transform: translateY(10px);
    color: whitesmoke;
    border: 1px solid black;
    text-shadow: 1px 1px 1px darkgoldenrod;
}
.oxotnichiyKi{
    color: black;
}

@media (max-width:810px) {
    .collaction>.container{
        flex-direction: column;
        flex-wrap: wrap;
    }
    .box{
        width: 50%;
        margin: 0 auto;
        margin-top: 15px;
    }
}
@media (max-width:760px){
    #a{
        display: none;
    }
    .boxContent{
        overflow-y: scroll;
        height: 400px;
        width: 100%;
        /* background-color: rgb(184, 184, 184); */
        padding: 20px;
    }
    .contentMini{
        font-size: 17px;
        color:black;
        width: 100%;
        text-shadow: 5px 5px 5px white;
    }
    .AbouteSite>.container{
        flex-direction: column;
    }
    #nav{
        padding: 0px;
    }
    .ImgTop{
        width: 100%;
        margin: 0 auto;
    }
}