@charset "utf-8";
/* CSS Document */

/* ============================================================== */
/* header ===================================================== */

#header-img{
    margin: 0;
    width: 100;
    height: 100vh;
    background-image:url("../src/headerimg/portfolio-header_1401-1920.jpg");
    background-size: cover; /* VIMP */
    background-position: center; /* VIMP */
}

/* ===================================================== */
/* ===================================================== */
/* ===================================================== */
/* ===================================================== */
/* ===================================================== */
/* ===================================================== */

/* X-Small devices (portrait phones, less than 576px) */
/* No media query for `xs` since this is the default in Bootstrap */

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 320px) and (max-width: 576px) {
    #header-img{
        margin: 0;
        width: 100;
        height: 100vh;
        background-image:url("../src/headerimg/portfolio-header_320-576.jpg");
        background-size: cover; /* VIMP */
        background-position: center; /* VIMP */
    }
    
}
/* // Medium devices (tablets, 768px and up) */
@media (min-width: 577px) and (max-width: 768px) {
    #header-img{
        margin: 0;
        width: 100;
        height: 100vh;
        background-image:url("../src/headerimg/portfolio-header_577-768.jpg");
        background-size: cover; /* VIMP */
        background-position: center; /* VIMP */
    }
    
}
/* // Large devices (desktops, 992px and up) */
@media (min-width: 769px) and (max-width: 992px) {
    #header-img{
        margin: 0;
        width: 100;
        height: 100vh;
        background-image:url("../src/headerimg/portfolio-header_769-992.jpg");
        background-size: cover; /* VIMP */
        background-position: center; /* VIMP */
    }

}
/* // Large devices (large desktops, 1200px and up) */
@media (min-width: 993px) and (max-width: 1200px) {
    #header-img{
        margin: 0;
        width: 100;
        height: 100vh;
        background-image:url("../src/headerimg/portfolio-header_993-1200.jpg");
        background-size: cover; /* VIMP */
        background-position: center; /* VIMP */
    }
    
}
/* // Large devices (larger desktops, 1400px and up) */
@media (min-width: 1201px) and (max-width: 1400px) {
    #header-img{
        margin: 0;
        width: 100;
        height: 100vh;
        background-image:url("../src/headerimg/portfolio-header_1201-1400.jpg");
        background-size: cover; /* VIMP */
        background-position: center; /* VIMP */
    }
    
}