/*@media only screen and (max-width: 992px) {
    *{
        display: none;
    }
}*/
.section{
    padding:30px 0;
}
.project-card {
    margin: 0 0 20px 0;
}
.project-card img{
    margin: 0 0 7px 0;
    object-fit: cover;
    object-position: center;
    /*transition: opacity 3s;*/
}
/*.project-card img:hover{
    opacity: 0.9;
}*/
.project-card h2{
    font-size: 24px;
    margin: 10px 0 30px 0;
}
.project-card img.small-img{
    height: 230px;
    object-fit: cover;
    object-position: center;
}
.header-section {
    padding: 30px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
@media only screen and (max-width: 575px) {
    .header-section {
        padding: 0 7px;
    }
    .section {
        padding: 30px 7px;
    }
    .project-card h2 {
        font-size: 16px;
    }
}
@media only screen and (max-width: 768px) {
    .project-card img.small-img, .project-card img {
        height: 200px;
    }
}
@media only screen and (min-width: 768px) {
    .project-card img {
        margin: 0 0 7px 0;
        height: 375px;
    }
    .project-card img.small-img {
        height: 150px;
    }
}
@media only screen and (min-width: 1200px) {
    .section {
        padding: 30px 4%;
    }
    .project-card img {
        margin: 0 0 7px 0;
        height: 390px;
    }
    .project-card img.small-img {
        height: 160px;
    }
}
@media only screen and (min-width: 1440px) {
    .section {
        padding: 30px 10%;
    }
    .project-card img {
        margin: 0 0 7px 0;
        height: 390px;
    }
    .project-card img.small-img {
        height: 170px;
    }
}

/* header css starts */
.menu-switch i {
    color: #000;
    font-size: 50px;
    line-height: 50px;
}
.menu-switch {
    margin-right: 15px;
}
@media only screen and (min-width: 575px) {
    .header-section {
        padding: 7px 4%;
    }
    .section {
        padding: 30px 4%;
    }
}
@media only screen and (min-width: 1200px) {
    .header-section {
        padding: 30px 4%;
    }
    .section {
        padding: 30px 4%;
    }
}
@media only screen and (min-width: 1440px) {
    .header-section {
        padding: 30px 10%;
    }
    .section {
        padding: 30px 10%;
    }
}
/* header css ends */