/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-width : 320px) and (max-width:568px)  {
    #projects-list .content .text{
        background: #3b5ea9;
        padding: 10px 20px;
        transition: ease all 0.5s;
    }

    #projects-list .service .content .text span,
    #projects-list .service .content .text a{
        opacity: 1;
        transition: ease all 0.5s;
    }

    #projects-list .service .content .text h2 {
        margin: 10px 0;
        transition: ease all 0.5s;
    }
}
/* Smartphones landscape */
@media only screen and (min-width : 320px) and (max-width:568px) and (orientation : landscape)  {

}

/* Smartphones (portrait) ----------- */
@media only screen and (min-width : 320px) and (max-width:568px) and (orientation : portrait)  {
    #MainNav {
        display: flex;
        justify-content: center;
    }

}

/* Small Tablets Both */
@media only screen and (min-width : 600px) and (max-width:800px)  {



}

/* Small Tablets (Portrait) ----------- */
@media only screen and (min-width : 600px) and (max-width : 800px) and (orientation : portrait) {

}

/* Small Tablets (landscape) ----------- */
@media only screen and (min-width : 600px) and (max-width : 800px) and (orientation : landscape) {

}

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-width : 801px) and (max-width : 1024px) {

}

/* iPads (landscape) ----------- */
@media only screen and (min-width : 801px) and (max-width : 1024px) and (orientation : landscape) {

}
/* iPads (portrait) ----------- */
@media only screen and (min-width : 768px) and (max-width : 1024px) and (orientation : portrait) {

}

/* Larger Screens */
@media only screen and (min-width : 1025px) and (max-device-width : 1980px) {

}