.home3-container-courses {
    background-color: rgb(233,230,233);
    /*padding-top: 2.8em;*/
    padding-bottom: 2.7em;
    padding-left: 0 !important;
    padding-right: 0 !important;
    
}

.home3-container-courses-title{
    padding-top: 2.7em;
}



.home3-container-courses-title,.home3-container-courses-cards{
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    transition: var(--transitionTiming);
}
.home3-container-courses-title:hover h2{
    /*color:var(--mainColor);*/
}
.h2Visited{
    color:var(--mainColor);
    text-shadow: rgba(135, 198, 90, 0.199) -10px 10px;
}


.home3-container-courses-cards {
    padding-top: 1.8em;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap:2.5em;
    row-gap: 3.4em;
    
}
.home3-container-courses-cards-card {
    display: flex;
    flex-direction: column;
    gap:1em;
    width: 11em;
    transition: var(--transitionTiming);
}
.home3-container-courses-cards-card h3{
    font-size: 1rem !important;
    text-align: center;
    font-weight: 100 !important;
}

.home3-container-courses-cards-card img{
    transition: var(--transitionTiming);
}

.home3-container-courses-cards-card span {
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s, opacity 0.5s linear;
    position: absolute;
    margin-left: 3.5em;
    font-size: 2.5rem;
    transition: var(--transitionTiming);
    color: white;
}

.home3-container-courses-cards-card:hover span, .home3-container-courses-cards-card:hover .home-3-container-courses-cards-hover {
    visibility: visible;
    opacity: 1;
}
.home3-container-courses-cards-card:hover h3{
    color:var(--mainColor) !important;
}

.home-3-container-courses-cards-hover{
    visibility: hidden;
    opacity: 0;
    /*transition: visibility 0s, opacity 0.5s linear;*/
    position: absolute; 
    color: white;
    top: auto;
    /*margin-left: 2em;*/
    /*background: linear-gradient(to top right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 50%, var(--mainColor) 50%, var(--mainColor) 100%);*/
    background: var(--mainColor);
    width: 11em;
    height: 11em;
    /*margin-left: 8.5em;*/
    -webkit-clip-path: polygon(100% 0%, calc(100% - 10.50em) 0%, 145% calc(100%), 0% 100%, 0% 0%, 0% 0%);
    clip-path: polygon(100% 0%, calc(100% ) 0%, 145% calc(100%), 0% 100%, 0% 0%, 0% 0%);

}


.home3-container-courses-cards-card img{   
    width: 11em; 
    height: 11em;
    object-fit: cover ;   
}
.home3-container-coursers-cards-hover-img {
    transition: var(--transitionTiming) ease;
    
}
.home3-container-courses-cards-card:hover  .home3-container-coursers-cards-hover-img{   
    filter: drop-shadow(.3em .5em 1em rgba(50, 50, 0, 0.5));
}
.home3-container-courses-cards-card:hover img{
    -webkit-clip-path: polygon(100% 0%, calc(144% - 10.50em) 0%, 145% calc(100%), 0% 100%, 0% 0%, 0% 0%);
    clip-path: polygon(100% 0%, calc(144% - 10.50em) 0%, 145% calc(100%), 0% 100%, 0% 0%, 0% 0%);
    
    /*box-shadow: rgb(31 36 27 / 20%) 8px 7px 3px;*/
}

@media only screen and (max-width: 900px) {
    .home3-container-courses {
        text-align: center;
        padding: 1.9em;
        padding-bottom: 1em;
    }
    .home3-container-courses-title{
        padding-top: unset;
    }
    .home3-container-courses-cards {
        justify-content: center;
        padding-top: 1em;
        row-gap: 1em;
    }
    .home3-container-courses-cards-card span {
        margin-left: .25em;
    }
    
}



