/*
 * Default CSS, covers 0 to 319px
 */
.previous-next {
    background-color: #fff;
    padding: 8px;
}

.previous-next .p-n-link {
    color: #484848;
    display: block;
    margin: 20px 0;
}

.previous-next .p-n-link span, 
.previous-next .p-n-link .p-n-desc {
    display: none;
}

.previous-next .p-n-label {
    margin-bottom: 5px;
    text-transform: uppercase;
}

.previous-next .p-n-title {
    font: 16px/1 "PNC Brand Bold", Arial, sans-serif;
    margin-bottom: 7px;
}

.previous-next .p-n-desc {
    font: 12px/1 Arial, sans-serif;
}
/*
 *  Mobile
 */
@media only screen and (min-width: 320px) {

    .previous-next {
        padding: 0 20px;
    }

    .previous-next .content-inner {
        background: url("../img/shadow_prev_next_m.png") no-repeat scroll center top transparent;
        overflow: hidden;
        margin: 0 auto;
        padding: 0;
    }

    .previous-next .p-n-link {
        margin: 30px 0;
        max-width: 40%;
    }

    .previous-next .p-n-link.previous {
        float: left;
    }

    .previous-next .p-n-link.next {
        float: right;
    }

    .previous-next .p-n-link.previous span, 
  	.previous-next .p-n-link.previous .p-n-txt {
        float: left;
    }
    
    .previous-next .p-n-link.previous span{
    	margin-right: 5px;
    }
    
    .previous-next .p-n-link.next span{
    	margin-left: 5px;
    }

    .previous-next .p-n-link.next span, 
  	.previous-next .p-n-link.next .p-n-txt {
        float: right;
    }

    .previous-next .p-n-link.next .p-n-txt {
        text-align: right;
    }
    
    .previous-next .p-n-link span {
        background: url("../img/sprite_prev_next.png") no-repeat scroll 0 0 transparent;
        display: block;
        height: 52px;
        text-indent: -9999px;
        width: 48px;
        margin-bottom: 15px;
    }

    .previous-next .p-n-link.previous span {
        background-position: 0 0;
    }

    .previous-next .p-n-link.previous:hover span {
        background-position: 0 -52px;
    }

    .previous-next .p-n-link.next span {
        background-position: -48px 0;
    }

    .previous-next .p-n-link.next:hover span {
        background-position: -48px -52px;
    }
    
}

/*
 *  Tablet
 */
@media only screen and (min-width: 600px) {
    .previous-next {
        padding: 0;
    }

    .previous-next .content-inner {
        background: url("../img/shadow_prev_next_t.png") no-repeat scroll center top transparent;
        padding: 0 10px;
        width: 580px;
    }

    .previous-next .p-n-link {
        max-width: none;
    }

    .previous-next .p-n-link span, 
  .previous-next .p-n-link .p-n-desc {
        display: block;
    }

    .previous-next .p-n-link span {
        background: url("../img/sprite_prev_next.png") no-repeat scroll 0 0 transparent;
        display: block;
        height: 52px;
        text-indent: -9999px;
        width: 48px;
    }

    .previous-next .p-n-link.previous span {
        background-position: 0 0;
    }

    .previous-next .p-n-link.previous:hover span {
        background-position: 0 -52px;
    }

    .previous-next .p-n-link.next span {
        background-position: -48px 0;
    }

    .previous-next .p-n-link.next:hover span {
        background-position: -48px -52px;
    }

    .previous-next .p-n-txt {
        max-width: 222px;
    }

    .previous-next .p-n-link.previous .p-n-txt {
        margin-left: 10px;
    }

    .previous-next .p-n-link.next .p-n-txt {
        margin-right: 10px;
    }
}

/*
 *  Desktop
 */
@media screen and (min-width: 980px) {
    .previous-next .content-inner {
        background: url("../img/shadow_prev_next_d.png") no-repeat scroll center top transparent;
        margin: 0 auto;
        padding: 0 20px;
        width: 940px;
    }

    .previous-next .p-n-txt {
        max-width: 402px;
    }
}