﻿
/*#region Padding Css-Class Mappings */
/* #region All*/
.p-1 {
    padding: var(--spacing-tiny) !important;
}
.p-smaller {
    padding: var(--spacing-smaller);
}
.p-2 {
    padding: var(--spacing-small) !important;
}
.p-3{
    padding: var(--spacing-medium) !important;
}
.p-4 {
    padding: var(--spacing-large) !important;
}
.p-5 {
    padding: var(--spacing-larger);
}
.p-6{
    padding: var(--spacing-big);
}
/* #endregion*/

/*#region TOP*/
.pt-1 {
    padding-top: var(--spacing-tiny) !important;
}
 
.pt-smaller {
    padding-top: var(--spacing-smaller);
}

.pt-2 {
    padding-top: var(--spacing-small) !important;
}

.pt-3{
    padding-top: var(--spacing-medium) !important;
}

.pt-4 {
    padding-top: var(--spacing-large) !important;
}

.pt-5 {
    padding-top: var(--spacing-larger);
}

.pt-6{
    padding-top: var(--spacing-big);
}

.pt-1 {
    padding-top: var(--spacing-tiny);
}
 
.mobile-pt-smaller {
    padding-top: var(--spacing-smaller);
}

.mobile-pt-2 {
    padding-top: var(--spacing-small);
}

.mobile-pt-3{
    padding-top: var(--spacing-medium);
}

.mobile-pt-4 {
    padding-top: var(--spacing-large);
}

.mobile-pt-5 {
    padding-top: var(--spacing-larger);
}

.mobile-pt-6{
    padding-top: var(--spacing-big);
}
 
/** Größere Monitore **/
@media only screen and (min-width: 768px) {

    .mobile-pt-smaller,
    .mobile-pt-1,
    .mobile-pt-2,
    .mobile-padding-top-medium,
    .mobile-pt-4,
    .mobile-pt-5,
    .mobile-pt-6{
        padding-top: 0px;
    }
}
/* #endregion*/

/*#region RIGHT*/
.pr-1 {
    padding-right: var(--spacing-tiny) !important;
}

.pr-smaller {
    padding-right: var(--spacing-smaller);
}

.pr-2 {
    padding-right: var(--spacing-small) !important;
}

.pr-3 {
    padding-right: var(--spacing-medium) !important;
}

.pr-4 {
    padding-right: var(--spacing-large) !important;
}

.pr-5 {
    padding-right: var(--spacing-larger);
}

.pr-6 {
    padding-right: var(--spacing-big);
}
 
.mobile-pr-smaller {
    padding-right: var(--spacing-smaller);
}

.mobile-pr-2 {
    padding-right: var(--spacing-small);
}

.mobile-pr-3 {
    padding-right: var(--spacing-medium);
}

.mobile-pr-4 {
    padding-right: var(--spacing-large);
}

.mobile-pr-5 {
    padding-right: var(--spacing-larger);
}

.mobile-pr-6 {
    padding-top: var(--spacing-big);
}
 
/** Größere Monitore **/
@media only screen and (min-width: 768px) {

    .mobile-pr-smaller,
    .mobile-pr-1,
    .mobile-pr-2,
    .mobile-pr-3,
    .mobile-pr-4,
    .mobile-pr-5,
    .mobile-pr-6 {
        padding-right: 0px;
    }
}
/* #endregion*/

/*#region LEFT*/
.pl-1 {
    padding-left: var(--spacing-tiny) !important;
}

.pl-smaller {
    padding-left: var(--spacing-smaller);
}

.pl-2{
    padding-left: var(--spacing-small) !important;
}

.pl-3{
    padding-left: var(--spacing-medium) !important;
}

.pl-4{
    padding-left: var(--spacing-large) !important;
}

.pl-5 {
    padding-left: var(--spacing-larger);
}

.pl-6 {
    padding-left: var(--spacing-big);
}
 
.mobile-pl-smaller {
    padding-left: var(--spacing-smaller);
}

.mobile-pl-2{
    padding-left: var(--spacing-small);
}

.mobile-pl-3{
    padding-left: var(--spacing-medium);
}

.mobile-pl-4{
    padding-left: var(--spacing-large);
}

.mobile-pl-5 {
    padding-left: var(--spacing-larger);
}

.mobile-pl-6 {
    padding-top: var(--spacing-big);
}
 
/** Größere Monitore **/
@media only screen and (min-width: 768px) {

    .mobile-pl-smaller,
    .mobile-pl-1,
    .mobile-padding-left-small,
    .mobile-padding-left-medium,
    .mobile-padding-left-large,
    .mobile-pl-5,
    .mobile-pl-6 {
        padding-left: 0px;
    }
}
/* #endregion*/

/*#region BOTTOM*/
.pb-1 {
    padding-bottom: var(--spacing-tiny) !important;
}

.pb-smaller {
    padding-bottom: var(--spacing-smaller);
}

.pb-2 {
    padding-bottom: var(--spacing-small) !important;
}

.pb-3 {
    padding-bottom: var(--spacing-medium);
}

.pb-4 {
    padding-bottom: var(--spacing-large) !important;
}

.pb-5 {
    padding-bottom: var(--spacing-larger);
}

.pb-6 {
    padding-bottom: var(--spacing-big);
}

.pb-1 {
    padding-bottom: var(--spacing-tiny);
}

 
.mobile-pb-smaller {
    padding-bottom: var(--spacing-smaller);
}

.mobile-pb-2 {
    padding-bottom: var(--spacing-small);
}

.mobile-pb-3 {
    padding-bottom: var(--spacing-medium);
}

.mobile-pb-4 {
    padding-bottom: var(--spacing-large);
}

.mobile-pb-5 {
    padding-bottom: var(--spacing-larger);
}

.mobile-pb-6 {
    padding-top: var(--spacing-big);
}

 
/** Größere Monitore **/
@media only screen and (min-width: 768px) {

    .mobile-pb-smaller,
    .mobile-pb-1,
    .mobile-pb-2,
    .mobile-pb-3,
    .mobile-pb-4,
    .mobile-pb-5,
    .mobile-pb-6 {
        padding-bottom: 0px;
    }
}
/* #endregion*/
/*#endregion  padding Css-Class Mappings END ++++++ */
