.piercingPriceTable
{
    padding: 0;
    margin: 0;
}

    .piercingPriceTable tr.headerRow td
    {
        font-size: 12px;
        color: #000;
        font-weight: 700;
    }

    .piercingPriceTable td
    {
        padding: 5px 0;
        border-bottom: 1px solid #eee;
    }

.portfolioList li
{
    overflow: hidden;
    float: left;
    margin: 0 20px 20px 0;
    text-align: center;
}

    .portfolioList li .portfolioImage
    {
        text-align: center;
        background-size: cover;
        margin: 0 0 5px 0;
    }

    .portfolioList li:hover
    {
        cursor: pointer;
    }

    .portfolioList li .galleryRollover
    {
        position: absolute;
        background-image: url(/images/galleryZoom.png);
        background-repeat: no-repeat;
        background-position: center;
        z-index: 2;
        background-color: rgba(0,0,0,0.5);
        opacity: 0;
        -webkit-transition: all 0.15s ease-in 0.15s;
        -moz-transition: all 0.15s ease-in 0.15s;
        -o-transition: all 0.15s ease-in 0.15s;
        -ms-transition: all 0.15s ease-in 0.15s;
        transition: all 0.15s ease-in 0.15s;
    }

    .portfolioList li:hover .galleryRollover
    {
        -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
        filter: alpha(opacity=100);
        opacity: 1;
        -webkit-transition-delay: 0s;
        -moz-transition-delay: 0s;
        -o-transition-delay: 0s;
        -ms-transition-delay: 0s;
        transition-delay: 0s;
    }

@media screen and (min-width: 0px)
{
    .piercingPriceTable td
    {
        width: 33%;
    }

    .pricingRight, .pricingLeft
    {
        width: 100% !important;
        clear: both;
    }

    .pricingRight
    {
        margin: 10px 0 0 0 !important;
    }

        .pricingRight .sf_2cols_2in_50
        {
            margin: 0px !important;
        }

    .portfolioList li
    {
        float: none;
        margin: auto;
        text-align: left;
    }

        .portfolioList li .portfolioImage, .galleryRollover
        {
            width: 250px !important;
            height: 250px !important;
        }

    .portfolioList li
    {
        margin: 0 0 20px 0;
    }
}

@media screen and (min-width: 1001px)
{
    .piercingPriceTable td
    {
        width: 200px;
    }

    .pricingRight, .pricingLeft
    {
        width: 100% !important;
        clear: both;
    }

    .pricingRight
    {
        margin: 10px 0 0 0 !important;
    }

        .pricingRight .sf_2cols_2in_50
        {
            margin: 0px !important;
        }

    .portfolioList li
    {
        float: left;
        text-align: center;
        margin: 0 20px 20px 0;
    }

        .portfolioList li .portfolioImage, .galleryRollover
        {
            width: 202px !important;
            height: 202px !important;
        }

        .portfolioList li:nth-child(3n+3)
        {
            margin: 0 0 20px 0;
        }
}

@media screen and (min-width: 1024px)
{
    .piercingPriceTable td
    {
        width: 137px;
    }

    .pricingRight, .pricingLeft
    {
        width: 50% !important;
        clear: none;
    }

    .pricingRight
    {
        margin: 0 !important;
    }

        .pricingRight .sf_2cols_2in_50
        {
            margin: inherit !important;
        }

    .portfolioList li .portfolioImage, .galleryRollover
    {
        width: 216px !important;
        height: 216px !important;
    }

    .portfolioList li:nth-child(3n+3)
    {
        margin: 0 20px 20px 0;
    }

    .portfolioList li:nth-child(4n+4)
    {
        margin: 0 0 20px 0;
    }
}

@media screen and (min-width: 1250px)
{
    .piercingPriceTable td
    {
        width: 175px;
    }

    .portfolioList li .portfolioImage, .galleryRollover
    {
        width: 272px !important;
        height: 272px !important;
    }
}

@media screen and (min-width: 1400px)
{
    .piercingPriceTable td
    {
        width: 200px;
    }

    .portfolioList li .portfolioImage, .galleryRollover
    {
        width: 310px !important;
        height: 310px !important;
    }
}