:root{
    --text-color:none;
    --soft-color:none;
    --dark-color:none;
    --border-color:none;
    --card-color:none;
    --film-color:none;
}

* {
padding: 0%;
margin: 0%;
}

@media screen and (max-width: 730px){
    /* project-1===== */
    .project-1{
        width: 100%;
    }
    .project-image-1{
        grid-column: 1/13;
        opacity: .3;
    }
    .project-content-1{
        grid-column: 1/13;
        grid-row: 1/2;
        background-color: var(--soft-color);
        opacity: .7;
        padding: 5px 20px;
        border-radius: 6px;
        -webkit-box-shadow: -1px 1px 3px -1px rgba(0,0,0,0.75);
        -moz-box-shadow: -1px 1px 3px -1px rgba(0,0,0,0.75);
        box-shadow: -1px 1px 3px -1px rgba(0,0,0,0.75);
    }
    .project-desc{
        background-color: transparent;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }
    /* project-1===== */
    .project-2{
        width: 100%;
    }
    .project-image-2{
        grid-column: 1/13;
        opacity: .3;
    }
    .project-content-2{
        grid-column: 1/13;
        grid-row: 1/2;
        background-color: var(--soft-color);
        opacity: .7;
        padding: 5px 20px;
        border-radius: 6px;
        -webkit-box-shadow: -1px 1px 3px -1px rgba(0,0,0,0.75);
        -moz-box-shadow: -1px 1px 3px -1px rgba(0,0,0,0.75);
        box-shadow: -1px 1px 3px -1px rgba(0,0,0,0.75);
    }
    .project-desc{
        background-color: transparent;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }
    

}