/**
 * RSX Framework
 * Copyright 2015 Bell Canada
 * 
 * Helper classes to apply padding.
 * Reference: http://rsxdeployment.azurewebsites.net/docs/cheatsheet.html#helper 
 */

/* responsive */
.rsx-pad-responsive,
.rsx-pad-responsive-60,
.rsx-pad-responsive-80 {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}


@media (max-width: 639px),
(min-width: 999px) and (max-width: 1239px) {
    .rsx-pad-responsive,
    .rsx-pad-responsive-h {
        padding-right: 20px !important;
        padding-left: 20px !important;
    }

    .rsx-pad-responsive-60,
    .rsx-pad-responsive-h-60 {
        padding-right: 40px !important;
        padding-left: 40px !important;
    }

    .rsx-pad-responsive-80,
    .rsx-pad-responsive-h-80 {
        padding-right: 60px !important;
        padding-left: 60px !important;
    }
}


@media (min-width: 640px) and (max-width: 999px),
(min-width: 1240px) {
    .rsx-pad-responsive,
    .rsx-pad-responsive-h {
        padding-right: 40px !important;
        padding-left: 40px !important;
    }

    .rsx-pad-responsive-60,
    .rsx-pad-responsive-h-60 {
        padding-right: 60px !important;
        padding-left: 60px !important;
    }

    .rsx-pad-responsive-80,
    .rsx-pad-responsive-80-h {
        padding-right: 80px !important;
        padding-left: 80px !important;
    }
}




/* basic */
.rsx-pad {
    padding: 20px !important;
}

.rsx-pad-top {
    padding-top: 20px !important;
}

.rsx-pad-right {
    padding-right: 20px !important;
}

.rsx-pad-bottom {
    padding-bottom: 20px !important;
}

.rsx-pad-left {
    padding-left: 20px !important;
}

.rsx-pad-v {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

.rsx-pad-h {
    padding-right: 20px !important;
    padding-left: 20px !important;
}


@media (max-width: 519px) {
    .rsx-pad-xs {
        padding: 20px !important;
    }

    .rsx-pad-top-xs {
        padding-top: 20px !important;
    }

    .rsx-pad-right-xs {
        padding-right: 20px !important;
    }

    .rsx-pad-bottom-xs {
        padding-bottom: 20px !important;
    }

    .rsx-pad-left-xs {
        padding-left: 20px !important;
    }

    .rsx-pad-v-xs {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }

    .rsx-pad-h-xs {
        padding-right: 20px !important;
        padding-left: 20px !important;
    }
}


@media (min-width: 520px) and (max-width: 999px) {
    .rsx-pad-sm {
        padding: 20px !important;
    }

    .rsx-pad-top-sm {
        padding-top: 20px !important;
    }

    .rsx-pad-right-sm {
        padding-right: 20px !important;
    }

    .rsx-pad-bottom-sm {
        padding-bottom: 20px !important;
    }

    .rsx-pad-left-sm {
        padding-left: 20px !important;
    }

    .rsx-pad-v-sm {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }

    .rsx-pad-h-sm {
        padding-right: 20px !important;
        padding-left: 20px !important;
    }

    .rsx-pad-15-top-sm{
        padding-top: 15px !important;
    }
}


@media (min-width: 1000px) and (max-width: 1239px) {
    .rsx-pad-md {
        padding: 20px !important;
    }

    .rsx-pad-top-md {
        padding-top: 20px !important;
    }

    .rsx-pad-right-md {
        padding-right: 20px !important;
    }

    .rsx-pad-bottom-md {
        padding-bottom: 20px !important;
    }

    .rsx-pad-left-md {
        padding-left: 20px !important;
    }

    .rsx-pad-v-md {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }

    .rsx-pad-h-md {
        padding-right: 20px !important;
        padding-left: 20px !important;
    }
}


@media (min-width: 1240px) {
    .rsx-pad-lg {
        padding: 20px !important;
    }

    .rsx-pad-top-lg {
        padding-top: 20px !important;
    }

    .rsx-pad-right-lg {
        padding-right: 20px !important;
    }

    .rsx-pad-bottom-lg {
        padding-bottom: 20px !important;
    }

    .rsx-pad-left-lg {
        padding-left: 20px !important;
    }

    .rsx-pad-v-lg {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }

    .rsx-pad-h-lg {
        padding-right: 20px !important;
        padding-left: 20px !important;
    }
}




/* 5 & 10 */

.rsx-pad-5 {
    padding: 5px !important;
}

.rsx-pad-5-top {
    padding-top: 5px !important;
}

.rsx-pad-5-right {
    padding-right: 5px !important;
}

.rsx-pad-5-bottom {
    padding-bottom: 5px !important;
}

.rsx-pad-5-left {
    padding-left: 5px !important;
}

.rsx-pad-5-v {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}

.rsx-pad-5-h {
    padding-right: 5px !important;
    padding-left: 5px !important;
}


.rsx-pad-10 {
    padding: 10px !important;
}

.rsx-pad-10-top {
    padding-top: 10px !important;
}

.rsx-pad-10-right {
    padding-right: 10px !important;
}

.rsx-pad-10-bottom {
    padding-bottom: 10px !important;
}

.rsx-pad-10-left {
    padding-left: 10px !important;
}

.rsx-pad-10-v {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

.rsx-pad-10-h {
    padding-right: 10px !important;
    padding-left: 10px !important;
}

.rsx-pad-15 {
    padding: 15px !important;
}

@media (max-width: 519px) {

    .rsx-pad-5-xs {
        padding: 5px !important;
    }

    .rsx-pad-5-top-xs {
        padding-top: 5px !important;
    }

    .rsx-pad-5-right-xs {
        padding-right: 5px !important;
    }

    .rsx-pad-5-bottom-xs {
        padding-bottom: 5px !important;
    }

    .rsx-pad-5-left-xs {
        padding-left: 5px !important;
    }

    .rsx-pad-5-v-xs {
        padding-top: 5px !important;
        padding-bottom: 5px !important;
    }

    .rsx-pad-5-h-xs {
        padding-right: 5px !important;
        padding-left: 5px !important;
    }


    .rsx-pad-10-xs {
        padding: 10px !important;
    }

    .rsx-pad-10-top-xs {
        padding-top: 10px !important;
    }

    .rsx-pad-10-right-xs {
        padding-right: 10px !important;
    }

    .rsx-pad-10-bottom-xs {
        padding-bottom: 10px !important;
    }

    .rsx-pad-10-left-xs {
        padding-left: 10px !important;
    }

    .rsx-pad-10-v-xs {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    .rsx-pad-10-h-xs {
        padding-right: 10px !important;
        padding-left: 10px !important;
    }

    .rsx-pad-15-top-xs {
        padding-top: 15px !important;
    }

    .rsx-pad-15-bottom-xs {
        padding-bottom: 15px !important;
    }

    .rsx-pad-15-xs {
        padding: 15px !important;
    }
}


@media (min-width: 510px) and (max-width: 999px) {

    .rsx-pad-5-sm {
        padding: 5px !important;
    }

    .rsx-pad-5-top-sm {
        padding-top: 5px !important;
    }

    .rsx-pad-5-right-sm {
        padding-right: 5px !important;
    }

    .rsx-pad-5-bottom-sm {
        padding-bottom: 5px !important;
    }

    .rsx-pad-5-left-sm {
        padding-left: 5px !important;
    }

    .rsx-pad-5-v-sm {
        padding-top: 5px !important;
        padding-bottom: 5px !important;
    }

    .rsx-pad-5-h-sm {
        padding-right: 5px !important;
        padding-left: 5px !important;
    }


    .rsx-pad-10-sm {
        padding: 10px !important;
    }

    .rsx-pad-10-top-sm {
        padding-top: 10px !important;
    }

    .rsx-pad-10-right-sm {
        padding-right: 10px !important;
    }

    .rsx-pad-10-bottom-sm {
        padding-bottom: 10px !important;
    }

    .rsx-pad-10-left-sm {
        padding-left: 10px !important;
    }

    .rsx-pad-10-v-sm {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    .rsx-pad-10-h-sm {
        padding-right: 10px !important;
        padding-left: 10px !important;
    }

    .rsx-pad-15-sm {
        padding: 15px !important;
    }
}


@media (min-width: 1000px) and (max-width: 1239px) {

    .rsx-pad-5-md {
        padding: 5px !important;
    }

    .rsx-pad-5-top-md {
        padding-top: 5px !important;
    }

    .rsx-pad-5-right-md {
        padding-right: 5px !important;
    }

    .rsx-pad-5-bottom-md {
        padding-bottom: 5px !important;
    }

    .rsx-pad-5-left-md {
        padding-left: 5px !important;
    }

    .rsx-pad-5-v-md {
        padding-top: 5px !important;
        padding-bottom: 5px !important;
    }

    .rsx-pad-5-h-md {
        padding-right: 5px !important;
        padding-left: 5px !important;
    }


    .rsx-pad-10-md {
        padding: 10px !important;
    }

    .rsx-pad-10-top-md {
        padding-top: 10px !important;
    }

    .rsx-pad-10-right-md {
        padding-right: 10px !important;
    }

    .rsx-pad-10-bottom-md {
        padding-bottom: 10px !important;
    }

    .rsx-pad-10-left-md {
        padding-left: 10px !important;
    }

    .rsx-pad-10-v-md {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    .rsx-pad-10-h-md {
        padding-right: 10px !important;
        padding-left: 10px !important;
    }

    .rsx-pad-15-md {
    padding: 15px !important;
}

}


@media (min-width: 1240px) {

    .rsx-pad-5-lg {
        padding: 5px !important;
    }

    .rsx-pad-5-top-lg {
        padding-top: 5px !important;
    }

    .rsx-pad-5-right-lg {
        padding-right: 5px !important;
    }

    .rsx-pad-5-bottom-lg {
        padding-bottom: 5px !important;
    }

    .rsx-pad-5-left-lg {
        padding-left: 5px !important;
    }

    .rsx-pad-5-v-lg {
        padding-top: 5px !important;
        padding-bottom: 5px !important;
    }

    .rsx-pad-5-h-lg {
        padding-right: 5px !important;
        padding-left: 5px !important;
    }

    .rsx-pad-10-lg {
        padding: 10px !important;
    }

    .rsx-pad-10-top-lg {
        padding-top: 10px !important;
    }

    .rsx-pad-10-right-lg {
        padding-right: 10px !important;
    }

    .rsx-pad-10-bottom-lg {
        padding-bottom: 10px !important;
    }

    .rsx-pad-10-left-lg {
        padding-left: 10px !important;
    }

    .rsx-pad-10-v-lg {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    .rsx-pad-10-h-lg {
        padding-right: 10px !important;
        padding-left: 10px !important;
    }

    .rsx-pad-15-lg {
        padding: 15px !important;
    }
}




/* 40 */
.rsx-pad-40 {
    padding: 40px !important;
}

.rsx-pad-40-top {
    padding-top: 40px !important;
}

.rsx-pad-40-right {
    padding-right: 40px !important;
}

.rsx-pad-40-bottom {
    padding-bottom: 40px !important;
}

.rsx-pad-40-left {
    padding-left: 40px !important;
}

.rsx-pad-40-v {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}

.rsx-pad-40-h {
    padding-right: 40px !important;
    padding-left: 40px !important;
}

@media (max-width: 519px) {
    .rsx-pad-40-xs {
        padding: 40px !important;
    }

    .rsx-pad-40-top-xs {
        padding-top: 40px !important;
    }

    .rsx-pad-40-right-xs {
        padding-right: 40px !important;
    }

    .rsx-pad-40-bottom-xs {
        padding-bottom: 40px !important;
    }

    .rsx-pad-40-left-xs {
        padding-left: 40px !important;
    }

    .rsx-pad-40-v-xs {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }

    .rsx-pad-40-h-xs {
        padding-right: 40px !important;
        padding-left: 40px !important;
    }
}


@media (min-width: 540px) and (max-width: 999px) {
    .rsx-pad-40-sm {
        padding: 40px !important;
    }

    .rsx-pad-40-top-sm {
        padding-top: 40px !important;
    }

    .rsx-pad-40-right-sm {
        padding-right: 40px !important;
    }

    .rsx-pad-40-bottom-sm {
        padding-bottom: 40px !important;
    }

    .rsx-pad-40-left-sm {
        padding-left: 40px !important;
    }

    .rsx-pad-40-v-sm {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }

    .rsx-pad-40-h-sm {
        padding-right: 40px !important;
        padding-left: 40px !important;
    }
}


@media (min-width: 1000px) and (max-width: 1239px) {
    .rsx-pad-40-md {
        padding: 40px !important;
    }

    .rsx-pad-40-top-md {
        padding-top: 40px !important;
    }

    .rsx-pad-40-right-md {
        padding-right: 40px !important;
    }

    .rsx-pad-40-bottom-md {
        padding-bottom: 40px !important;
    }

    .rsx-pad-40-left-md {
        padding-left: 40px !important;
    }

    .rsx-pad-40-v-md {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }

    .rsx-pad-40-h-md {
        padding-right: 40px !important;
        padding-left: 40px !important;
    }
}


@media (min-width: 1240px) {
    .rsx-pad-40-lg {
        padding: 40px !important;
    }

    .rsx-pad-40-top-lg {
        padding-top: 40px !important;
    }

    .rsx-pad-40-right-lg {
        padding-right: 40px !important;
    }

    .rsx-pad-40-bottom-lg {
        padding-bottom: 40px !important;
    }

    .rsx-pad-40-left-lg {
        padding-left: 40px !important;
    }

    .rsx-pad-40-v-lg {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }

    .rsx-pad-40-h-lg {
        padding-right: 40px !important;
        padding-left: 40px !important;
    }
}

/* 80 */

.rsx-pad-80 {
    padding: 80px !important;
}

.rsx-pad-80-top {
    padding-top: 80px !important;
}

.rsx-pad-80-right {
    padding-right: 80px !important;
}

.rsx-pad-80-bottom {
    padding-bottom: 80px !important;
}

.rsx-pad-80-left {
    padding-left: 80px !important;
}

.rsx-pad-80-v {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
}

.rsx-pad-80-h {
    padding-right: 80px !important;
    padding-left: 80px !important;
}

@media (max-width: 519px) {
    .rsx-pad-80-xs {
        padding: 80px !important;
    }

    .rsx-pad-80-top-xs {
        padding-top: 80px !important;
    }

    .rsx-pad-80-right-xs {
        padding-right: 80px !important;
    }

    .rsx-pad-80-bottom-xs {
        padding-bottom: 80px !important;
    }

    .rsx-pad-80-left-xs {
        padding-left: 80px !important;
    }

    .rsx-pad-80-v-xs {
        padding-top: 80px !important;
        padding-bottom: 80px !important;
    }

    .rsx-pad-80-h-xs {
        padding-right: 80px !important;
        padding-left: 80px !important;
    }
}


@media (min-width: 540px) and (max-width: 999px) {
    .rsx-pad-80-sm {
        padding: 80px !important;
    }

    .rsx-pad-80-top-sm {
        padding-top: 80px !important;
    }

    .rsx-pad-80-right-sm {
        padding-right: 80px !important;
    }

    .rsx-pad-80-bottom-sm {
        padding-bottom: 80px !important;
    }

    .rsx-pad-80-left-sm {
        padding-left: 80px !important;
    }

    .rsx-pad-80-v-sm {
        padding-top: 80px !important;
        padding-bottom: 80px !important;
    }

    .rsx-pad-80-h-sm {
        padding-right: 80px !important;
        padding-left: 80px !important;
    }
}


@media (min-width: 1000px) and (max-width: 1239px) {
    .rsx-pad-80-md {
        padding: 80px !important;
    }

    .rsx-pad-80-top-md {
        padding-top: 80px !important;
    }

    .rsx-pad-80-right-md {
        padding-right: 80px !important;
    }

    .rsx-pad-80-bottom-md {
        padding-bottom: 80px !important;
    }

    .rsx-pad-80-left-md {
        padding-left: 80px !important;
    }

    .rsx-pad-80-v-md {
        padding-top: 80px !important;
        padding-bottom: 80px !important;
    }

    .rsx-pad-80-h-md {
        padding-right: 80px !important;
        padding-left: 80px !important;
    }
}


@media (min-width: 1240px) {
    .rsx-pad-80-lg {
        padding: 80px !important;
    }

    .rsx-pad-80-top-lg {
        padding-top: 80px !important;
    }

    .rsx-pad-80-right-lg {
        padding-right: 80px !important;
    }

    .rsx-pad-80-bottom-lg {
        padding-bottom: 80px !important;
    }

    .rsx-pad-80-left-lg {
        padding-left: 80px !important;
    }

    .rsx-pad-80-v-lg {
        padding-top: 80px !important;
        padding-bottom: 80px !important;
    }

    .rsx-pad-80-h-lg {
        padding-right: 80px !important;
        padding-left: 80px !important;
    }
}


/* none */
.rsx-no-pad {
    padding: 0 !important;
}

.rsx-no-pad-top {
    padding-top: 0 !important;
}

.rsx-no-pad-right {
    padding-right: 0 !important;
}

.rsx-no-pad-bottom {
    padding-bottom: 0 !important;
}

.rsx-no-pad-left {
    padding-left: 0 !important;
}

.rsx-no-pad-v {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.rsx-no-pad-h {
    padding-right: 0 !important;
    padding-left: 0 !important;
}


@media (max-width: 519px) {
    .rsx-no-pad-xs {
        padding: 0 !important;
    }

    .rsx-no-pad-top-xs {
        padding-top: 0 !important;
    }

    .rsx-no-pad-right-xs {
        padding-right: 0 !important;
    }

    .rsx-no-pad-bottom-xs {
        padding-bottom: 0 !important;
    }

    .rsx-no-pad-left-xs {
        padding-left: 0 !important;
    }

    .rsx-no-pad-v-xs {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .rsx-no-pad-h-xs {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
}


@media (min-width: 520px) and (max-width: 999px) {
    .rsx-no-pad-sm {
        padding: 0 !important;
    }

    .rsx-no-pad-top-sm {
        padding-top: 0 !important;
    }

    .rsx-no-pad-right-sm {
        padding-right: 0 !important;
    }

    .rsx-no-pad-bottom-sm {
        padding-bottom: 0 !important;
    }

    .rsx-no-pad-left-sm {
        padding-left: 0 !important;
    }

    .rsx-no-pad-v-sm {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .rsx-no-pad-h-sm {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
}


@media (min-width: 1000px) and (max-width: 1239px) {
    .rsx-no-pad-md {
        padding: 0 !important;
    }

    .rsx-no-pad-top-md {
        padding-top: 0 !important;
    }

    .rsx-no-pad-right-md {
        padding-right: 0 !important;
    }

    .rsx-no-pad-bottom-md {
        padding-bottom: 0 !important;
    }

    .rsx-no-pad-left-md {
        padding-left: 0 !important;
    }

    .rsx-no-pad-v-md {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .rsx-no-pad-h-md {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
}


@media (min-width: 1240px) {
    .rsx-no-pad-lg {
        padding: 0 !important;
    }

    .rsx-no-pad-top-lg {
        padding-top: 0 !important;
    }

    .rsx-no-pad-right-lg {
        padding-right: 0 !important;
    }

    .rsx-no-pad-bottom-lg {
        padding-bottom: 0 !important;
    }

    .rsx-no-pad-left-lg {
        padding-left: 0 !important;
    }

    .rsx-no-pad-v-lg {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .rsx-no-pad-h-lg {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
}