:root {
	--white: #fff;
	--green: #00DD7B;
	--red: #CC4546;
	--azure: #2B5597;
	--blue: #00234E;
	--grey: #424242;
	--cyan: #7DE1CA;

	--font-family: "Outfit";
	--font-family-ico: "Font Awesome 6 Pro";
	--font-family-ico-alt: "Font Awesome 5 Brands";
	--font-weight-light: 300;
	--font-weight-regular: 400;
	--font-weight-medium: 600;
	--font-weight-bold: 700;
	--font-weight-solid: 900;

	--font-size-base: 14px;
}

/* Landing */
header {background-color: #C3FAEB;background-image: linear-gradient(179deg, #e6fff9 11%, #96DECB 70%);text-align: center;}
header #top { text-align: center; }
header #top .logo { text-align: left; }
header #top .logo a { display: block; text-align: left; }
header #top .logo a img { text-align: left; }
header #top #menu { text-align: right; }
header #top #menu .varlink { text-align: right; }
header #top #menu .varlink a { display: block; font-weight: var(--font-weight-medium); font-size: 16px; color: var(--blue); text-align: right; line-height: 1;  }
header #top #menu .cta { text-align: center; }
header #top #menu .cta .varlink a { padding: 15px 20px; display: block; border-radius: 23px; background-color: var(--azure); font-weight: var(--font-weight-medium); font-size: 85%; color: var(--white); text-transform: uppercase; text-align: center; line-height: 1; letter-spacing: 2px; }
header .caption { text-align: left; }
header .caption .text { text-align: left; }
header .caption .text .vareditor { font-weight: var(--font-weight-medium); font-size: 46px; color: var(--blue); text-align: left; line-height: 48px; letter-spacing: -0.5px; }
header .caption .cost { text-align: center; }
header .caption .cost .elem { text-align: center; }
header .caption .cost .elem .number { text-align: center; }
header .caption .cost .elem .number .varsimple { font-weight: var(--font-weight-medium); font-size: 48px; color: var(--blue);  text-align: center; line-height: 48px; }
header .caption .cost .elem .text { text-align: center; }
header .caption .cost .elem .text .varsimple {font-size: 16px; color: var(--blue);  text-align: center; line-height: 1; }
header .caption .cost .elem.variable { text-align: left; }
header .caption .cost .elem.variable .number { text-align: left; }
header .caption .cost .elem.variable .number .varsimple { font-weight: var(--font-weight-medium); font-size: 48px; color: var(--blue);  text-align: center; line-height: 48px;  }
header .caption .cost .elem.variable .number .varsimple:after { font-weight: var(--font-weight-medium); font-size: 18px; color: var(--blue);  text-align: left; line-height: 18px; content: "%"; }
header .caption .cost .elem.variable .text { text-align: left; }
header .caption .cost .elem.variable .text .varsimple { font-size: 16px; color: var(--blue);  text-align: left; line-height: 1;  }
header .caption .cta { text-align: center; display: block; border-radius: 23px; background-color: var(--azure); font-weight: var(--font-weight-medium); font-size: 85%; color: var(--white); text-align: center; line-height: 1; letter-spacing: 2px;}
header img { text-align: left; }
section#partners { text-align: left; }
section#partners .partner { text-align: left; }
section#partners .partner .brand { background-color: var(--white); text-align: left; box-shadow: 0 2px 20px 0 rgba(0,0,0,0.20); }
section#partners .partner .brand img { text-align: left; }
section#partners .partner .desc { font-weight: var(--font-weight-medium); font-size: 21px; color: var(--white); text-align: left; line-height: 1;  }
section#why { text-align: left; }
section#why #template5 { text-align: left; position: relative; }
section#why #template5 .row { text-align: left; }
section#why #template5 .row .box { text-align: left; }
section#why #template5 .row .box .elem {text-align: left;}
section#why #template5 .row .box .elem .caption-cnt { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; text-align: left; list-style: none; -ms-box-orient: horizontal; -webkit-align-items: center; align-items: center; }
section#why #template5 .row .box .elem .caption-cnt .caption { width: 44%; text-align: left; order: 1; }
section#why #template5 .row .box .elem .caption-cnt .caption img { text-align: left; }
section#why #template5 .row .box .elem .caption-cnt .caption-alt { width: 55%; text-align: left; order: 2; }
section#why #template5 .row .box .elem .caption-cnt .caption-alt:before { background-color: var(--grey); text-align: left; }
section#why #template5 .row .box .elem .caption-cnt .caption-alt .title { font-weight: var(--font-weight-medium); font-size: 22px; color: var(--blue); text-align: left; line-height: 1; letter-spacing: -0.5px; }
section#why #template5 .row .box .elem .caption-cnt .caption-alt .title:before { font-family: var(--font-family-ico); font-weight: var(--font-weight-light); font-size: 30px; color: var(--azure);  text-align: center; line-height: 1; }
section#why #template5 .row .box .elem .caption-cnt .caption-alt .ztextarea { font-size: 16px; color: var(--grey); text-align: left; line-height: 25px; }
section#nexi { background-color: #4462c9; text-align: center; }
section#nexi .icon { text-align: center; }
section#nexi .icon .vareditor {font-weight: var(--font-weight-medium);font-size: 20px;color: #CBDFFF;text-align: center;line-height: 1;letter-spacing: -0.8px;}
section#nexi .icon .vareditor:before {margin: 0 0 10px 0;font-family: var(--font-family-ico); font-weight: var(--font-weight-light);font-size: 90px;color: #93BDFF;text-align: center;line-height: 90px;letter-spacing: 0;content: "\f2f7";display: block;}
section#nexi .icon .vareditor strong { font-weight: var(--font-weight-medium); font-size: 20px; color: #93BDFF; text-align: center; line-height: 1; letter-spacing: -0.8px; }
section#nexi .title { text-align: left; }
section#nexi .title .vareditor { font-weight: var(--font-weight-medium); font-size: 46px; color: var(--white); text-align: left; line-height: 48px; letter-spacing: -0.5px; }
section#nexi .description { text-align: left; }
section#nexi .description .vareditor { font-size: 18px; color: var(--white); text-align: left; line-height: 29px; }
section#nexi .description img { text-align: left; }

section#howto { text-align: center; }
section#pricing { text-align: left; }

/* Template - Prezzi */
section#pricing .ztemplate { text-align: left; position: relative; }
section#pricing .ztemplate .template_filters { margin: 0 auto 40px auto;text-align: center;display: inline-block;}
section#pricing .ztemplate .template_filters .filter_key { font-size: 100%; text-transform: uppercase; display: none;  }
section#pricing .ztemplate .template_filters .filter_values label { display: none; }
section#pricing .ztemplate .template_filters .filter_values .value { padding: 8px 0 0 70px;font-size: 100%;letter-spacing: 0;font-weight: var(--font-weight-medium);color: var(--white);font-size: 16px;}
/*Radio*/
section#pricing .ztemplate .template_filters .filter_values .form_radio { display: flex;align-items: center;display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: flex-start; }
section#pricing .ztemplate .template_filters .filter_values .form_radio .radio {text-align: left;position: relative;display: flex;align-items: center;padding: 0 0 0 20px;margin: 5px 0px 5px 0;cursor: pointer; display: flex;flex-wrap: wrap;align-items: flex-start;justify-content: flex-start;}
section#pricing .ztemplate .template_filters .filter_values .form_radio .radio .rad {text-align: left;position: relative;}
section#pricing .ztemplate .template_filters .filter_values .form_radio .radio .rad:after {width: 25px;height: 25px;display: block; border-radius: 100%;background-color: var(--azure);text-align: left;box-shadow: 0 6px 13px -6px rgba(0,0,0,0.22);z-index: 216;position: absolute;left: 6px;right: unset;top: 5px;bottom: unset;content: '';transition: 0.3s ease-out;}
section#pricing .ztemplate .template_filters .filter_values .form_radio .radio .rad:before {width: 60px;height: 35px;display: block;border: 1px solid var(--white)75;border-radius: 35px;background-color: var(--blue);text-align: left;z-index: 200;position: absolute;left: 0px;right: unset;top: 0px;bottom: unset;content: '';transition: 0.3s ease-out; background: var(--white);}
section#pricing .ztemplate .template_filters .filter_values .form_radio .radio.checked { text-align: left; }
section#pricing .ztemplate .template_filters .filter_values .form_radio .radio.checked .rad { text-align: left;  }
section#pricing .ztemplate .template_filters .filter_values .form_radio .radio.checked .rad:after {width: 25px;height: 25px;border: 1px solid #59C172;border-radius: 100%;background-color: var(--white);text-align: left;box-shadow: 0 6px 13px -6px rgba(0,0,0,0.22);z-index: 152;position: absolute;left: 30px;right: unset;top: 5px;bottom: unset;}
section#pricing .ztemplate .template_filters .filter_values .form_radio .radio.checked .rad:before {width: 60px;height: 35px;border: 1px solid #59C172;border-radius: 35px;background-color: #59C172;text-align: left;z-index: 136;position: absolute;left: 0px;right: unset;top: 0px;bottom: unset;}

section#pricing .ztemplate .row { text-align: left; }
section#pricing .ztemplate .row .box { text-align: left; }
section#pricing .ztemplate .row .box .elem {text-align: left;position: relative;}
section#pricing .ztemplate .row .box .elem .caption-cnt { padding: 25px; background-color: var(--white); }
section#pricing .ztemplate .row .box .elem .caption-cnt .caption { text-align: left; order: 1; }
section#pricing .ztemplate .row .box .elem .caption-cnt .caption .title {font-weight: var(--font-weight-medium); font-size: 32px; color: var(--blue); text-align: left; line-height: 31px; letter-spacing: -1px; }
section#pricing .ztemplate .row .box .elem .caption-cnt .caption .ztextarea { font-size: 16px; color: var(--grey); text-align: left; line-height: 21px; }
section#pricing .ztemplate .row .box .elem .caption-cnt .caption-alt { text-align: left; order: 2; }
section#pricing .ztemplate .row .box .elem .caption-cnt .caption-alt .zinput.number { text-align: left; }
section#pricing .ztemplate .row .box .elem .caption-cnt .caption-alt .zinput.number .fieldkey { font-size: 15px; color: var(--blue);  text-align: center; line-height: 1; }
section#pricing .ztemplate .row .box .elem .caption-cnt .caption-alt .zinput.number .fieldvalue { font-weight: var(--font-weight-medium); font-size: 28px; color: var(--azure);  text-align: right; line-height: 28px; }
section#pricing .ztemplate .row .box .elem .caption-cnt .caption-alt .zinput.number .fieldvalue:after { font-weight: var(--font-weight-medium); font-size: 14px; color: var(--azure);  text-align: left; line-height: 14px; content: "\20AC"; }
section#pricing .ztemplate .row .box .elem .caption-cnt .caption-add { text-align: center; order: 3; }
section#pricing .ztemplate .row .box .elem .caption-cnt .caption-add .zlink { display: block; text-align: center; }
section#pricing .ztemplate .row .box .elem .caption-cnt .caption-add .zlink a { padding: 20px; display: block; border-radius: 27px; background-color: var(--azure); font-weight: var(--font-weight-medium); font-size: 85%; color: var(--white); text-transform: uppercase; text-align: center; line-height: 1; letter-spacing: 2px; }
section#pricing .ztemplate .row .box .elem .caption-cnt .caption-add .ztextarea { font-size: 14px; color: var(--grey); text-align: center; line-height: 22px; }
section#pricing .ztemplate .row .box .elem .caption-cnt .caption-4 { text-align: left; order: 4; }
section#pricing .ztemplate .row .box .elem .caption-cnt .caption-4 .zinput { background-color: var(--green); font-weight: var(--font-weight-medium); font-size: 13px; color: var(--blue);  text-align: left; line-height: 12px; }
#mail-contact { background-color: var(--cyan); text-align: left; }
#mail-contact .title { text-align: left; }
#mail-contact .title .vareditor { font-weight: var(--font-weight-medium); font-size: 42px; color: var(--blue); text-align: left; line-height: 48px; letter-spacing: -1px; }
#mail-contact .title .vareditor:before { font-family: var(--font-family-ico); font-weight: var(--font-weight-light); font-size: 90px; color: var(--blue);  text-align: center; line-height: 90px; }
#mail-contact .description { text-align: left; }
#mail-contact .description .vareditor { font-weight: var(--font-weight-medium); font-size: 16px; color: var(--blue); text-align: left; line-height: 29px;  }
#mail-contact .description .fake-btn { border-radius: 27px; background-color: var(--white); text-align: center; }
#mail-contact .description .fake-btn #cta-mail { text-align: center; }
#mail-contact .description .fake-btn #cta-mail .varsimple { border-radius: 27px; background-color: var(--blue); font-weight: var(--font-weight-medium); font-size: 85%; color: var(--white); text-transform: uppercase; text-align: center; line-height: 1; letter-spacing: 2px; }
footer { background-color: var(--blue); text-align: left; }
footer .col { text-align: left; }
footer .col .logo { text-align: left; }
footer .col .vareditor { font-size: 16px; color: var(--white); text-align: left; line-height: 25px; }
footer .col #social { font-family: var(--font-family-ico-alt); font-size: 16px; color: var(--white);  text-align: left; line-height: 25px; }
footer .col.company { text-align: left; }
footer .col.company .varsimple { font-weight: var(--font-weight-medium); font-size: 22px; color: var(--white); text-align: left; line-height: 1; }
footer .col.company .vareditor { font-weight: var(--font-weight-medium); font-size: 14px; color: var(--white); text-align: left; line-height: 20px; }
footer .col.contact { text-align: left; }
footer .col.contact .varsimple { font-weight: var(--font-weight-medium); font-size: 22px; color: var(--white); text-align: left; line-height: 1; }
footer .col.contact .vareditor { padding:0px 0 15px 30px; font-weight: var(--font-weight-medium); font-size: 16px; color: var(--white);  text-align: left; line-height: 16px; position: relative;}
footer .col.contact .vareditor:before { font-family: var(--font-family-ico); font-weight: var(--font-weight-solid); font-size: 16px; color: var(--white);  text-align: left; line-height: 16px; content: "\f095"; position: absolute; left: 0;}
footer .col.contact .privacy { font-weight: var(--font-weight-medium); font-size: 14px; color: var(--white); text-align: left; line-height: 16px; }

/* Section */
.section-title {font-weight: var(--font-weight-medium);font-size: 48px;color: var(--blue);text-align: center;line-height: 1;letter-spacing: -1px;position: relative;z-index: 3;}
.section-decription {font-weight: var(--font-weight-medium);font-size: 24px;color: var(--azure);text-align: center;line-height: 28px;position: relative;z-index: 3;}