﻿

/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {
    #wideLoginBackground {
        background-image: url('@Url.Content("~/")Assets/img/curved-images/background_SPPI_small.png');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: top;
        width: 100%;
        height: 50vh;
    }
}

/*// Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
    #wideLoginBackground {
        background-image: url('@Url.Content("~/")Assets/img/curved-images/background_SPPI_small.png');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: top;
        width: 100%;
        height: 50vh;
    }
}

/*// Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
    #wideLoginBackground {
        background-image: url('@Url.Content("~/")Assets/img/curved-images/background_SPPI_small.png');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: top;
        width: 100%;
        height: 50vh;
    }
}

/*// X-Large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
    #wideLoginBackground {
        background-image: url('@Url.Content("~/")Assets/img/curved-images/background_SPPI_new.png');
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-size: auto 100%;
        background-position: right;
    }
}
    

/*// XX-Large devices (larger desktops, 1400px and up)*/
@media (min-width: 1400px) {
    #wideLoginBackground {
        background-image: url('@Url.Content("~/")Assets/img/curved-images/background_SPPI_new.png');
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-size: auto 100%;
        background-position: right;
    }
}