/* -------------------------------------------------------------------------------- */
/* ! ALIGN WIDE & ALIGN FULL */
/* -------------------------------------------------------------------------------- */
/* @ Alignfull */
.alignfull {width: 100vw;margin-left: calc(50% - 50vw);}

/* @ Alignwide */
.alignwide {width: 90vw;margin-left:calc(50% - 45vw);}

/* @media (min-width: 960px) {
	.alignwide {width: calc(100% + 20vw);margin: 2rem -10vw;}
} */

@media (max-width: 768px) {
	.alignfull {padding: 20px;}
} /* Fine query */

.alignfull .wp-block-group {max-width:1250px; margin: 0 auto;padding: 0 20px;}

@media (max-width: 768px) {
    .alignfull .wp-block-group {padding: 0;}
} /* Fine query */

/* -------------------------------------------------------------------------------- */
/* ! GRID SYSTEM 360smartweb */
/* -------------------------------------------------------------------------------- */
.grid {
    margin: 0 auto;
    padding: 0 10px 10px 10px;
    max-width: 1250px;
    width: 100%;
    display: flex;
    flex-flow: row;
    flex-wrap: wrap;
}
.grid--center{
    justify-content: center;
    align-items: center;
    text-align: center;
}
.container-100 {
    width:100%;
}
.container-fluid {
    width:100vw;height: 100vh;
}
.col-flex {
    flex: 1;padding: 0 20px;
}
[class*='col-'] {
    position: relative;
    padding: 0 10px;
}
.col-05{
    width: 5%;
}
.col-10{
    width: 10%;
}
.col-15{
    width: 15%;
}
.col-16{
    width: 16.6666666%;
}
.col-20{
    width: 20%;
}
.col-25{
    width: 25%;
}
.col-30{
    width: 30%;
}
.col-33{
    width: 33.33%;
}
.col-35{
    width: 35%;
}
.col-40{
    width: 40%;
}
.col-45{
    width: 45%;
}
.col-50{
    width: 50%;
}
.col-55{
    width: 55%;
}
.col-60{
    width: 60%;
}
.col-65{
    width: 65%;
}
.col-66{
    width: 66.6666666%;
}
.col-70{
    width: 70%;
}
.col-75{
    width: 75%;
}
.col-80{
    width: 80%;
}
.col-85{
    width: 85%;
}
.col-90{
    width: 90%;
}
.col-95{
    width: 95%;
}
.col-100{
    width: 100%;
}

@media (max-width: 768px) {
    .grid {
        flex-direction: column;
    }
    [class^="col-"].smart {
        width: 100% !important;
    }
    
    [class^="col-"] {
        padding: 0 10px;
    }
}
/* -------------------------------------------------------------------------------- */
/* ! MARGINI */
/* -------------------------------------------------------------------------------- */
:root {
    --spacing-0: 0;
    --spacing-1: 1rem;
    --spacing-2: 2rem;
    --spacing-3: 3rem;
    --spacing-4: 4rem;
    --spacing-5: 5rem;
    --spacing-6: 6rem;
}
/* Margine top */
[class^="mt"] {
    margin-top: var(--spacing-0);
}
.mt1 {
    margin-top: var(--spacing-1);
}
.mt2 {
    margin-top: var(--spacing-2);
}
.mt3 {
    margin-top: var(--spacing-3);
}
.mt4 {
    margin-top: var(--spacing-4);
}
.mt5 {
    margin-top: var(--spacing-5);
}
.mt6 {
    margin-top: var(--spacing-6);
}

/* Margine bottom */
[class^="mb"] {
    margin-bottom: var(--spacing-0);
}
.mb1 {
    margin-bottom: var(--spacing-1);
}
.mb2 {
    margin-bottom: var(--spacing-2);
}
.mb3 {
    margin-bottom: var(--spacing-3);
}
.mb4 {
    margin-bottom: var(--spacing-4);
}
.mb5 {
    margin-bottom: var(--spacing-5);
}
.mb6 {
    margin-bottom: var(--spacing-6);
}

/* Margini orizzontali (left + right) */
[class^="mx"], [class*=" mx"]  {
    margin-left: var(--spacing-0);
    margin-right: var(--spacing-0);
}
.mx1 {
    margin-left: var(--spacing-1);
    margin-right: var(--spacing-1);
}
.mx2 {
    margin-left: var(--spacing-2);
    margin-right: var(--spacing-2);
}
.mx3 {
    margin-left: var(--spacing-3);
    margin-right: var(--spacing-3);
}
.mx4 {
    margin-left: var(--spacing-4);
    margin-right: var(--spacing-4);
}
.mx5 {
    margin-left: var(--spacing-5);
    margin-right: var(--spacing-5);
}
.mx6 {
    margin-left: var(--spacing-6);
    margin-right: var(--spacing-6);
}

/* Margini verticali (top + bottom) */
[class^="my"], [class*=" my"]  {
    margin-top: var(--spacing-0);
    margin-bottom: var(--spacing-0);
}
.my1 {
    margin-top: var(--spacing-1);
    margin-bottom: var(--spacing-1);
}
.my2 {
    margin-top: var(--spacing-2);
    margin-bottom: var(--spacing-2);
}
.my3 {
    margin-top: var(--spacing-3);
    margin-bottom: var(--spacing-3);
}
.my4 {
    margin-top: var(--spacing-4);
    margin-bottom: var(--spacing-4);
}
.my5 {
    margin-top: var(--spacing-5);
    margin-bottom: var(--spacing-5);
}
.my6 {
    margin-top: var(--spacing-6);
    margin-bottom: var(--spacing-6);
}

/* ! PADDING */
.pt-gigante {padding-top:150px;}
.pb-gigante {padding-bottom:150px;}
/* Padding top */
[class^="pt"] {
    padding-top: var(--spacing-0);
}
.pt1 {
    padding-top: var(--spacing-1);
}
.pt2 {
    padding-top: var(--spacing-2);
}
.pt3 {
    padding-top: var(--spacing-3);
}
.pt4 {
    padding-top: var(--spacing-4);
}
.pt5 {
    padding-top: var(--spacing-5);
}
.pt6 {
    padding-top: var(--spacing-6);
}

/* Padding bottom */
[class^="pb"] {
    padding-bottom: var(--spacing-0);
}
.pb1 {
    padding-bottom: var(--spacing-1);
}
.pb2 {
    padding-bottom: var(--spacing-2);
}
.pb3 {
    padding-bottom: var(--spacing-3);
}
.pb4 {
    padding-bottom: var(--spacing-4);
}
.pb5 {
    padding-bottom: var(--spacing-5);
}
.pb6 {
    padding-bottom: var(--spacing-6);
}

/* Padding left + right (horizontal) */
[class^="px"], [class*=" px"] {
    padding-inline: var(--spacing-0) !important;
}
.px1 {
    padding-left: var(--spacing-1);
    padding-right: var(--spacing-1);
}
.px2 {
    padding-left: var(--spacing-2);
    padding-right: var(--spacing-2);
}
.px3 {
    padding-left: var(--spacing-3);
    padding-right: var(--spacing-3);
}
.px4 {
    padding-left: var(--spacing-4);
    padding-right: var(--spacing-4);
}
.px5 {
    padding-left: var(--spacing-5);
    padding-right: var(--spacing-5);
}
.px6 {
    padding-left: var(--spacing-6);
    padding-right: var(--spacing-6);
}

/* Padding top + bottom (vertical) */
[class^="py"], [class*=" py"]  {
    padding-top: var(--spacing-0);
    padding-bottom: var(--spacing-0);
}
.py1 {
    padding-top: var(--spacing-1);
    padding-bottom: var(--spacing-1);
}
.py2 {
    padding-top: var(--spacing-2);
    padding-bottom: var(--spacing-2);
}
.py3 {
    padding-top: var(--spacing-3);
    padding-bottom: var(--spacing-3);
}
.py4 {
    padding-top: var(--spacing-4);
    padding-bottom: var(--spacing-4);
}
.py5 {
    padding-top: var(--spacing-5);
    padding-bottom: var(--spacing-5);
}
.py6 {
    padding-top: var(--spacing-6);
    padding-bottom: var(--spacing-6);
}

/* Padding all sides */
[class^="p"] {
    padding: var(--spacing-0);
}
.p1 {
    padding: var(--spacing-1);
}
.p2 {
    padding: var(--spacing-2);
}
.p3 {
    padding: var(--spacing-3);
}
.p4 {
    padding: var(--spacing-4);
}
.p5 {
    padding: var(--spacing-5);
}
.p6 {
    padding: var(--spacing-6);
}