:root{

    /* CONTENT */
    --content-p-font-size: clamp(16px, 15.423px + 0.180vw, 18px);
    --content-p-font-weight: normal;
    --content-heading-color: #000000;
    --content-heading-font-weight: normal;
    --content-p-color: #111111;
    --content-h1-font-size: clamp(38px, 35.694px + 0.721vw, 46px);
    --content-h2-font-size: clamp(34px, 31.694px + 0.721vw, 42px);
    --content-h3-font-size: clamp(30px, 27.694px + 0.721vw, 38px);
    --content-h4-font-size: clamp(26px, 24.270px + 0.541vw, 32px);
    --content-h5-font-size: clamp(22px, 20.270px + 0.541vw, 28px);
    --content-h6-font-size: clamp(20px, 18.847px + 0.360vw, 24px);
    --content-a-color: #000;
    --content-a-hover-color: #EAA901;
    --content-strong-color: #000000;

    /* CONTENT LI */
    --content-li-color: #000;
    --content-li-font-size: clamp(16px, 15.423px + 0.180vw, 18px);
    --content-li-font-weight: normal;
    --content-li-margin-left: auto;
    --content-li-margin-right: auto;
    --content-li-margin-bottom: auto;
    --content-li-margin-top: auto;
    --content-li-padding-left: 0;
    --content-li-padding-right: 0;
    --content-li-padding-bottom: 0;
    --content-li-padding-top: 0;

    /* FOOTER */
    --footer-bg-color: var(--header-shrink-bg-color);;
    --footer-logo-height: 100px;
    --footer-p-font-size: clamp(16px, 15.423px + 0.180vw, 18px);
    --footer-p-font-weight: normal;
    --footer-p-color: #000;
    --footer-li-font-size: clamp(16px, 15.423px + 0.180vw, 18px);
    --footer-li-font-weight: normal;
    --footer-li-color: #000;
    --footer-a-color: #000;
    --footer-a-hover-color: #EAA901;

    /* FOOTER BUTTON */
    --footer-button-color: #000;
    --footer-button-color-hover: #fff;
    --footer-button-bg-color: #fff;
    --footer-button-bg-color-hover: #000;
    --footer-button-border-radius: 4;
    --footer-button-border-color: #000;
    --footer-button-border-color-hover: #000;
    --footer-button-font-size: clamp(16px, 15.423px + 0.180vw, 18px);
    --footer-button-padding-left: 20px;
    --footer-button-padding-right: 20px;
    --footer-button-padding-bottom: 10px;
    --footer-button-padding-top: 10px;

    /* HEADER */
    --header-p-color: #ffffff;
    --header-p-font-size: clamp(16px, 15.423px + 0.180vw, 18px);
    --header-p-font-weight: normal;
    --header-li-color: #000;
    --header-li-font-size: clamp(16px, 15.423px + 0.180vw, 18px);
    --header-li-font-weight: normal;
    --header-a-color: #ffffff;
    --header-a-hover-color: #EAA901;
    --header-menu-font-size: clamp(16px, 15.423px + 0.180vw, 18px);
    --header-menu-color: #4C2870;
    --header-dropdown-color: #000;
    --header-dropdown-font-size: clamp(16px, 15.423px + 0.180vw, 18px);
    --header-dropdown-bg-color: #fff;
    --header-navbar-logo-height: 120px;
    --header-shrink-navbar-logo-height: 70px;
    --header-bg-color: transparent;
    --header-shrink-bg-color: rgba(255,255,255,0.8);
    --main-top-spacing: 30px;

    /* HEADER ACTIVE */
    --header-menu-active-bg-color: #4C2870;

    /* HEADER BUTTON */
    --header-button-color: #ffffff;
    --header-button-color-hover: #fff;
    --header-button-bg-color: #fff;
    --header-button-bg-color-hover: #000;
    --header-button-border-radius: 4px;
    --header-button-border-color: #000;
    --header-button-border-color-hover: #000;
    --header-button-font-size: clamp(16px, 15.423px + 0.180vw, 18px);
    --header-button-padding-left: 20px;
    --header-button-padding-right: 20px;
    --header-button-padding-bottom: 10px;
    --header-button-padding-top: 10px;

    /* CONTAINER */
    --container-margin-bottom: 50px;
    --container-margin-top: auto;
    --container-margin-left: auto;
    --container-margin-right: auto;
    --container-padding-bottom: 0;
    --container-padding-top: 0;
    --container-padding-left: 15px;
    --container-padding-right: 15px;

    /* FULLWIDTH CONTAINER */
    --fullwidth-container-margin-bottom: 50px;
    --fullwidth-container-margin-top: auto;
    --fullwidth-container-margin-left: auto;
    --fullwidth-container-margin-right: auto;
    --fullwidth-container-padding-bottom: 0;
    --fullwidth-container-padding-top: 0;
    --fullwidth-container-padding-left: 0;
    --fullwidth-container-padding-right: 0;

    /* BACKGROUND COLORS */
    --background1-bg-color: #fff;
    --background1-color: #000;
    --background2-bg-color: #eeeeee;
    --background2-color: #fff;
    --background3-bg-color: #fff;
    --background3-color: #000;
    --background4-bg-color: #fff;
    --background4-color: #000;

    /* BACKGROUND IMAGES */
    --background-image1-bg-image: url( /media/images/3279462667fb3498a6aa144e7cdea2ae.gif);
    --background-image1-color: green;
    --background-image2-bg-image: url( /media/images/Santiago_Latorre_Architecture_of_Friendship_28_Foto_Pedro_Anguila_1.jpg);
    --background-image2-color: #ffffff;

    /* BUTTON ELEMENTS */
    --button-color: #ffffff;
    --button-color-hover: #7EBA28;
    --button-bg-color: #7EBA28;
    --button-bg-color-hover: #ffffff;
    --button-font-size: clamp(16px, 15.423px + 0.180vw, 18px);
    --button-border-type: solid;
    --button-border-color: #7EBA28;
    --button-border-color-hover: #7EBA28;
    --button-border-radius: 70px;
    --button-padding-left: 20px;
    --button-padding-right: 20px;
    --button-padding-top: 10px;
    --button-padding-bottom: 10px;
    --button-border-size: 2px;

    /* FORM ELEMENTS */
    --form-input-height: 54px;
    --form-textarea-height: 140px;
    --form-input-border-radius: 8px;
    --form-input-border-size: 1px;
    --form-input-border-color: #000;
    --form-input-border-type: none;
    --form-input-bg: #f5f5f5;
    --form-input-font-size: 18px;
    --form-input-placeholder-font-size: 18px;
    --form-input-color: #555555;
    --form-input-placeholder-color: #555555;
    --form-input-margin-right: 0;
    --form-input-margin-left: 0;
    --form-input-margin-top: 0;
    --form-input-margin-bottom: 20px;
    --form-input-padding-right: 16px;
    --form-input-padding-left: 16px;
    --form-input-padding-top: 0;
    --form-input-padding-bottom: 0;

    /* ICONS */
    --icon-font-size: 20px;
    --icon-color: #000;
    --icon-plus-font-size: ;

    /* MENU FONT FAMILY */
    --heading-font-family: "Poppins", sans-serif;
    --general-text-font-family: "Poppins", sans-serif;
    --menu-font-family: "Noto-Sans", sans-serif;

    /* COLOR PALETTE */
    --main-color-1: #1E88E5;
    --main-color-2: #D32F2F;
    --main-color-3: #388E3C;
    --main-color-4: #FBC02D;
    --main-color-5: #8E24AA;
    --main-color-6: #F57C00;
    --main-color-7: #455A64;
    --main-color-8: #5E35B1;
    --main-color-9: #C2185B;
    --main-color-10: #000000;

    /* PREDEFINED CLASES */
    --margin-top-s: clamp(5px, 3.559px + 0.450vw, 10px);
    --margin-top-m: clamp(10px, 7.117px + 0.901vw, 20px);
    --margin-top-l: clamp(15px, 10.676px + 1.351vw, 30px);
    --margin-bottom-s: clamp(5px, 3.559px + 0.450vw, 10px);
    --margin-bottom-m: clamp(10px, 7.117px + 0.901vw, 20px);
    --margin-bottom-l: clamp(15px, 10.676px + 1.351vw, 30px);
    --margin-left-s: clamp(5px, 3.559px + 0.450vw, 10px);
    --margin-left-m: clamp(10px, 7.117px + 0.901vw, 20px);
    --margin-left-l: clamp(15px, 10.676px + 1.351vw, 30px);
    --margin-right-s: clamp(5px, 3.559px + 0.450vw, 10px);
    --margin-right-m: clamp(10px, 7.117px + 0.901vw, 20px);
    --margin-right-l: clamp(15px, 10.676px + 1.351vw, 30px);

    --padding-top-s: clamp(5px, 3.559px + 0.450vw, 10px);
    --padding-top-m: clamp(10px, 7.117px + 0.901vw, 20px);
    --padding-top-l: clamp(30px, 21.351px + 2.703vw, 60px);
    --padding-bottom-s: clamp(5px, 3.559px + 0.450vw, 10px);
    --padding-bottom-m: clamp(10px, 7.117px + 0.901vw, 20px);
    --padding-bottom-l: clamp(30px, 21.351px + 2.703vw, 60px);
    --padding-left-s: clamp(5px, 3.559px + 0.450vw, 10px);
    --padding-left-m: clamp(10px, 7.117px + 0.901vw, 20px);
    --padding-left-l: clamp(30px, 21.351px + 2.703vw, 60px);
    --padding-right-s: clamp(5px, 3.559px + 0.450vw, 10px);
    --padding-right-m: clamp(10px, 7.117px + 0.901vw, 20px);
    --padding-right-l: clamp(30px, 21.351px + 2.703vw, 60px);

    /* POPUPS */
    --popup-max-width: ;
    --popup-box-shadow: ;
    --popup-border-radius: ;
    --popup-border-color: ;
    --popup-border-size: ;
    --popup-border-type: ;
    --popup-padding-top: ;
    --popup-padding-right: ;
    --popup-padding-bottom: ;
    --popup-padding-left: ;
    --popup-bg: ;
    --popup-color: #000000;
}

/* FONDOS */
.background-type1{background: var(--background1-bg-color); color: var(--background1-color);}
.background-type1 *{ color: var(--background1-color); }

.background-type2{background: var(--background2-bg-color); color: var(--background2-color);}
.background-type2 *{ color: var(--background2-color); }

.background-type3{background: var(--background3-bg-color); color: var(--background3-color);}
.background-type3 *{ color: var(--background3-color); }

.background-type4{background: var(--background4-bg-color); color: var(--background4-color);}
.background-type4 *{ color: var(--background4-color); }

/* FONDOS */
*[class*="background-image"]{background-size: cover; background-repeat: no-repeat;}
.background-image1{background-image: var(--background-image1-bg-image); color: var(--background-image1-color);}
.background-image1 *{ color: var(--background-image1-color); }

.background-image2{background-image: var(--background-image2-bg-image); color: var(--background-image2-color);}
.background-image2 *{ color: var(--background-image2-color); }


/* ICONOS */
.icon{color: var(--icon-color); font-size: var(--icon-font-size);}

/* CONTENEDORES */
main > div {padding-top: var(--main-top-spacing);}
main .container{ margin-top: var(--container-margin-top); margin-bottom: var(--container-margin-bottom); margin-left: var(--container-margin-left); margin-right: var(--container-margin-right); padding-top: var(--container-padding-top); padding-bottom: var(--container-padding-bottom); padding-left: var(--container-padding-left); padding-right: var(--container-padding-right); }

/* CONTENEDORES ANCHO ENTERO */
main .fullwidth{ margin-top: var(--fullwidth-container-margin-top); margin-bottom: var(--fullwidth-container-margin-bottom); margin-left: var(--fullwidth-container-margin-left); margin-right: var(--fullwidth-container-margin-right); padding-top: var(--fullwidth-container-padding-top); padding-bottom: var(--fullwidth-container-padding-bottom); padding-left: var(--fullwidth-container-padding-left); padding-right: var(--fullwidth-container-padding-right); }

/* ELEMENTOS */
/* BOTON */
.btn{ background: var(--button-bg-color); color: var(--button-color); font-size: var(--button-font-size); border-radius: var(--button-border-radius); border: var(--button-border-size) var(--button-border-type) var(--button-border-color); padding-top: var(--button-padding-top); padding-bottom: var(--button-padding-bottom); padding-left: var(--button-padding-left); padding-right: var(--button-padding-right);}
.btn.active,
.btn:hover{ background: var(--button-bg-color-hover); color: var(--button-color-hover); border-color: var(--button-border-color-hover); }
.btn-invert .btn,
.btn-invert{ background: var(--button-bg-color-hover); color: var(--button-color-hover); font-size: var(--button-font-size); border-radius: var(--button-border-radius); border: var(--button-border-size) var(--button-border-type) var(--button-border-color-hover); padding-top: var(--button-padding-top); padding-bottom: var(--button-padding-bottom); padding-left: var(--button-padding-left); padding-right: var(--button-padding-right);}
.btn-invert .btn.active,
.btn-invert.active,
.btn-invert .btn:hover,
.btn-invert:hover{  border-color: var(--button-border-color);  background: var(--button-bg-color); color: var(--button-color); }

/* FORMULARIOS */
.form-control{height: var(--form-input-height); border-radius: var(--form-input-border-radius); border: var(--form-input-border-size) var(--form-input-border-type) var(--form-input-border-color); background: var(--form-input-bg); color: var(--form-input-color); font-size: var(--form-input-font-size); margin-top: var(--form-input-margin-top); margin-bottom: var(--form-input-margin-bottom); margin-left: var(--form-input-margin-left); margin-right: var(--form-input-margin-right); padding-top: var(--form-input-padding-top); padding-bottom: var(--form-input-padding-bottom); padding-left: var(--form-input-padding-left); padding-right: var(--form-input-padding-right); }

.form-control::placeholder{ color: var(--form-input-placeholder-color); font-size: var(--form-input-placeholder-font-size);}

textarea{height: var(--form-textarea-height) !important;}

/* HEADER */
header p{font-size: var(--header-p-font-size); color: var(--header-p-color); font-weight: var(--header-p-font-weight);}

header li *,
header li{font-size: var(--header-li-font-size); color: var(--header-li-color); font-weight: var(--header-li-font-weight);}

header a{color: var(--header-a-color);}
header a:hover{ color: var(--header-a-hover-color);}

header .btn{ background: var(--header-button-bg-color); color: var(--header-button-color); font-size: var(--header-button-font-size); border-radius: var(--header-button-border-radius); padding-top: var(--header-button-padding-top); padding-bottom: var(--header-button-padding-bottom); padding-left: var(--header-button-padding-left); padding-right: var(--header-button-padding-right);  border-color: var(--header-button-border-color);}
header .btn.active,
header .btn:hover{ background: var(--header-button-bg-color-hover); color: var(--header-button-color-hover); border-color: var(--header-button-border-color-hover); }
header .btn-invert .btn,
header .btn-invert{ background: var(--header-button-bg-color-hover); color: var(--header-button-color-hover); font-size: var(--header-button-font-size); border-radius: var(--header-button-border-radius); padding-top: var(--header-button-padding-top); padding-bottom: var(--header-button-padding-bottom); padding-left: var(--header-button-padding-left); padding-right: var(--header-button-padding-right);  border-color: var(--header-button-border-color-hover);}
header .btn-invert .btn.active,
header .btn-invert.active,
header .btn-invert .btn:hover,
header .btn-invert:hover{ background: var(--header-button-bg-color); color: var(--header-button-color); border-color: var(--header-button-border-color); }

header .navbar-brand{height: var(--header-navbar-logo-height);}
header .cbp-af-header.header-transparent.cbp-af-header-shrink .navbar-brand{height: var(--header-shrink-navbar-logo-height);}

header .cbp-af-header.header-transparent{background: var(--header-bg-color);}
header .cbp-af-header.header-transparent.cbp-af-header-shrink{background: var(--header-shrink-bg-color);}

header .dropdown-menu{background: var(--header-dropdown-bg-color); color: var(--header-dropdown-color); font-size: var(--header-dropdown-font-size);}
header .dropdown-menu *{color: var(--header-dropdown-color); font-size: var(--header-dropdown-font-size);}

header nav * {color: var(--header-menu-color); font-size: var(--header-menu-font-size); font-family: var(--menu-font-family);}

header .nav-link:hover::before,
header .nav-link.active::before { background-color: var(--header-menu-active-bg-color); }

/* CONTENT */
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6{ color: var(--content-heading-color); font-family: var(--heading-font-family); font-weight: var(--content-heading-font-weight);}
h1, .h1{ font-size: var(--content-h1-font-size); }
h2, .h2{ font-size: var(--content-h2-font-size); }
h3, .h3{ font-size: var(--content-h3-font-size); }
h4, .h4{ font-size: var(--content-h4-font-size); }
h5, .h5{ font-size: var(--content-h5-font-size); }
h6, .h6{ font-size: var(--content-h6-font-size); }

body { font-size: var(--content-p-font-size); font-family: var(--general-text-font-family); color: var(--content-p-color);}
main p{font-size: var(--content-p-font-size); color: var(--content-p-color); font-family: var(--general-text-font-family); font-weight: var(--content-p-font-weight);}

main a{ color: var(--content-a-color);}
main a:hover{ color: var(--content-a-hover-color);}

main li,
main li *{color: var(--content-li-color); font-size: var(--content-li-font-size); font-weight: var(--content-li-font-weight); margin-top: var(--content-li-margin-top); margin-bottom: var(--content-li-margin-bottom); margin-left: var(--content-li-margin-left); margin-right: var(--content-li-margin-right); padding-top: var(--content-li-padding-top); padding-bottom: var(--content-li-padding-bottom); padding-left: var(--content-li-padding-left); padding-right: var(--content-li-padding-right);}

strong{color: var(--content-strong-color);}

/* FOOTER */
footer{background: var(--footer-bg-color);}

footer .footer-logo img{height: var(--footer-logo-height);}

footer, footer p{font-size: var(--footer-p-font-size); color: var(--footer-p-color); font-weight: var(--footer-p-font-weight);}

footer a{ color: var(--footer-a-color);}
footer a:hover{ color: var(--footer-a-hover-color);}

footer li *,
footer li{color: var(--footer-li-color); font-size: var(--footer-li-font-size); font-weight: var(--footer-li-font-weight);}

footer .btn{ background: var(--footer-button-bg-color); color: var(--footer-button-color); font-size: var(--footer-button-font-size); border-radius: var(--footer-button-border-radius); padding-top: var(--footer-button-padding-top); padding-bottom: var(--footer-button-padding-bottom); padding-left: var(--footer-button-padding-left); padding-right: var(--footer-button-padding-right); border-color: var(--footer-button-border-color);}
footer .btn.active,
footer .btn:hover{ background: var(--footer-button-bg-color-hover); color: var(--footer-button-color-hover); border-color: var(--footer-button-border-color-hover); }
footer .btn-invert .btn,
footer .btn-invert{ background: var(--footer-button-bg-color-hover); color: var(--footer-button-color-hover); font-size: var(--footer-button-font-size); border-radius: var(--footer-button-border-radius); padding-top: var(--footer-button-padding-top); padding-bottom: var(--footer-button-padding-bottom); padding-left: var(--footer-button-padding-left); padding-right: var(--footer-button-padding-right); border-color: var(--footer-button-border-color-hover);}
footer .btn-invert .btn.active,
footer .btn-invert.active,
footer .btn-invert .btn:hover,
footer .btn-invert:hover{ background: var(--footer-button-bg-color); color: var(--footer-button-color); border-color: var(--footer-button-border-color); }


body .mt-l.mt-l { margin-top: var(--margin-top-l); }
body .mt-m.mt-m { margin-top: var(--margin-top-m); }
body .mt-s.mt-s { margin-top: var(--margin-top-s); }

body .mb-l.mb-l { margin-bottom: var(--margin-bottom-l); }
body .mb-m.mb-m { margin-bottom: var(--margin-bottom-m); }
body .mb-s.mb-s { margin-bottom: var(--margin-bottom-s); }

body .mr-l.mr-l { margin-right: var(--margin-right-l); }
body .mr-m.mr-m { margin-right: var(--margin-right-m); }
body .mr-s.mr-s { margin-right: var(--margin-right-s); }

body .ml-l.ml-l { margin-left: var(--margin-left-l); }
body .ml-m.ml-m { margin-left: var(--margin-left-m); }
body .ml-s.mb-s { margin-left: var(--margin-left-s); }

body .pt-l.pt-l { padding-top: var(--padding-top-l); }
body .pt-m.pt-m { padding-top: var(--padding-top-m); }
body .pt-s.pt-s { padding-top: var(--padding-top-s); }

body .pb-l.pb-l { padding-bottom: var(--padding-bottom-l); }
body .pb-m.pb-m { padding-bottom: var(--padding-bottom-m); }
body .pb-s.pb-s { padding-bottom: var(--padding-bottom-s); }

body .pr-l.pr-l { padding-right: var(--padding-right-l); }
body .pr-m.pr-m { padding-right: var(--padding-right-m); }
body .pr-s.pr-s { padding-right: var(--padding-right-s); }

body .pl-l.pl-l { padding-left: var(--padding-left-l); }
body .pl-m.pl-m { padding-left: var(--padding-left-m); }
body .pl-s.pb-s { padding-left: var(--padding-left-s); }

@media (max-width: 991px){
    body .tablet-mt-l.tablet-mt-l { margin-top: var(--margin-top-l); }
    body .tablet-mt-m.tablet-mt-m { margin-top: var(--margin-top-m); }
    body .tablet-mt-s.tablet-mt-s { margin-top: var(--margin-top-s); }

    body .tablet-mb-l.tablet-mb-l { margin-bottom: var(--margin-bottom-l); }
    body .tablet-mb-m.tablet-mb-m { margin-bottom: var(--margin-bottom-m); }
    body .tablet-mb-s.tablet-mb-s { margin-bottom: var(--margin-bottom-s); }

    body .tablet-mr-l.tablet-mr-l { margin-right: var(--margin-right-l); }
    body .tablet-mr-m.tablet-mr-m { margin-right: var(--margin-right-m); }
    body .tablet-mr-s.tablet-mr-s { margin-right: var(--margin-right-s); }

    body .tablet-ml-l.tablet-ml-l { margin-left: var(--margin-left-l); }
    body .tablet-ml-m.tablet-ml-m { margin-left: var(--margin-left-m); }
    body .tablet-ml-s.tablet-mb-s { margin-left: var(--margin-left-s); }

    body .tablet-pt-l.tablet-pt-l { padding-top: var(--padding-top-l); }
    body .tablet-pt-m.tablet-pt-m { padding-top: var(--padding-top-m); }
    body .tablet-pt-s.tablet-pt-s { padding-top: var(--padding-top-s); }

    body .tablet-pb-l.tablet-pb-l { padding-bottom: var(--padding-bottom-l); }
    body .tablet-pb-m.tablet-pb-m { padding-bottom: var(--padding-bottom-m); }
    body .tablet-pb-s.tablet-pb-s { padding-bottom: var(--padding-bottom-s); }

    body .tablet-pr-l.tablet-pr-l { padding-right: var(--padding-right-l); }
    body .tablet-pr-m.tablet-pr-m { padding-right: var(--padding-right-m); }
    body .tablet-pr-s.tablet-pr-s { padding-right: var(--padding-right-s); }

    body .tablet-pl-l.tablet-pl-l { padding-left: var(--padding-left-l); }
    body .tablet-pl-m.tablet-pl-m { padding-left: var(--padding-left-m); }
    body .tablet-pl-s.tablet-pb-s { padding-left: var(--padding-left-s); }
}
@media (max-width: 576px){
    body .mobile-mt-l.mobile-mt-l { margin-top: var(--margin-top-l); }
    body .mobile-mt-m.mobile-mt-m { margin-top: var(--margin-top-m); }
    body .mobile-mt-s.mobile-mt-s { margin-top: var(--margin-top-s); }

    body .mobile-mb-l.mobile-mb-l { margin-bottom: var(--margin-bottom-l); }
    body .mobile-mb-m.mobile-mb-m { margin-bottom: var(--margin-bottom-m); }
    body .mobile-mb-s.mobile-mb-s { margin-bottom: var(--margin-bottom-s); }

    body .mobile-mr-l.mobile-mr-l { margin-right: var(--margin-right-l); }
    body .mobile-mr-m.mobile-mr-m { margin-right: var(--margin-right-m); }
    body .mobile-mr-s.mobile-mr-s { margin-right: var(--margin-right-s); }

    body .mobile-ml-l.mobile-ml-l { margin-left: var(--margin-left-l); }
    body .mobile-ml-m.mobile-ml-m { margin-left: var(--margin-left-m); }
    body .mobile-ml-s.mobile-mb-s { margin-left: var(--margin-left-s); }

    body .mobile-pt-l.mobile-pt-l { padding-top: var(--padding-top-l); }
    body .mobile-pt-m.mobile-pt-m { padding-top: var(--padding-top-m); }
    body .mobile-pt-s.mobile-pt-s { padding-top: var(--padding-top-s); }

    body .mobile-pb-l.mobile-pb-l { padding-bottom: var(--padding-bottom-l); }
    body .mobile-pb-m.mobile-pb-m { padding-bottom: var(--padding-bottom-m); }
    body .mobile-pb-s.mobile-pb-s { padding-bottom: var(--padding-bottom-s); }

    body .mobile-pr-l.mobile-pr-l { padding-right: var(--padding-right-l); }
    body .mobile-pr-m.mobile-pr-m { padding-right: var(--padding-right-m); }
    body .mobile-pr-s.mobile-pr-s { padding-right: var(--padding-right-s); }

    body .mobile-pl-l.mobile-pl-l { padding-left: var(--padding-left-l); }
    body .mobile-pl-m.mobile-pl-m { padding-left: var(--padding-left-m); }
    body .mobile-pl-s.mobile-pb-s { padding-left: var(--padding-left-s); }
}

.popup-modal .modal-content{ border-radius: var(--popup-border-radius); border: var(--popup-border-size) var(--popup-border-type) var(--popup-border-color); box-shadow: var(--popup-box-shadow) }
.popup-modal .modal-content, .popup-modal .modal-dialog{ max-width: var(--popup-max-width); }
.popup-modal .popup-content{ background: var(--popup-bg); color: var(--popup-color); }
.popup-modal .popup-content *{ color: var(--popup-color); }
.popup-modal .popup-content .container, .popup-modal .popup-content .fullwidth{ padding-top: var(--popup-padding-top); padding-right: var(--popup-padding-right); padding-bottom: var(--popup-padding-bottom); padding-left: var(--popup-padding-left); }