@charset "UTF-8";
/* CSS Document */

@media only screen and (max-width: 1400px)
{
#come_funziona_section .app .caption span
{
font-size: 3.2rem;
}
}
@media only screen and (max-width: 1200px)
{
html
{
font-size:15px;
}
footer .marginesu .content {
  margin-top: 36px;
}
#menu li a.sel::before
{
width: calc(100% + 40px);
}
header #logo img
{
width:155px;
}
 #come_funziona_section .app .caption span {
    font-size: 2.9rem;
  }
}

@media only screen and (max-width: 1023px)
{	
#menuButton
{
font-family: "Font Awesome 6 Free";
font-weight: 900;
font-size:1.8rem;
color:#fff;
width:36px;
height:36px;
display:flex !important;
align-items:center;
justify-content:center;
position:relative;
z-index:1;
}
#menuButton.on
{
font-size:2rem;
}
#menuButton::before
{
content: "\f0c9";
}
#menuButton.on::before
{
content: "\f00d";
}

#menu
{
position:fixed;
z-index:0;
top:0;
height:0;
overflow:hidden;
top:0;
left:0;
width:100%;
display:flex;
align-items:center;
justify-content:center;
background-color: #7DF400;
}
body.pro #menu
{
background-color: #7c00ff;
}
#menu ul
{
min-width:100%;
}
#menu li
{
display:block;
margin-left:6%;
margin-right:6%;
padding-top:25px;
padding-bottom:25px;
}

#menu li a.sel::before
{
display:none;
}
#menu li a
{
display:inline-block;
}
#menu li a:not(.button)
{
font-size:3rem;
font-family: 'kit-rounded', arial;
font-weight:800;
}
#menu.on
{
height:100%;
}
#chi_siamo .tabella,#chi_siamo .tabella .cella,body.pro .tabella,body.pro .tabella .cella
{
display:block;
}
.tabella .content,.tabella.inverse .content.right,.tabella.inverse .content
{
margin-right:auto;
margin-left:auto;
}
#intro .box h2,body.pro h2
{
margin-top:50px;
}
#intro .box .button {
margin-top: 40px;
}
#intro::after
{
background-position: 90% 50%;
}
#come_funziona_section .box
{
display:block;
background-size: 185% auto;
background-position: 78% 0;
padding-top: 53%;
height:auto;
background-color:#7c00ff;
background-repeat:no-repeat;
}
#professionisti_imprese .box
{
display:block;
background-size: 185% auto;
background-position: 100% 0;
padding-top: 50%;
height:auto;
background-color:#7DF400;
background-repeat:no-repeat;
}
#come_funziona_section .box .button
{
margin-top:20px;
}
.steps .step {
  flex-basis: 50%;
}
#come_funziona_section .cards .card
{
max-width:500px;
margin-left:auto;
margin-right:auto;
}
#come_funziona_section .cards .card.marginesu
{
margin-top:0;
}
#come_funziona_section .cards .card h3,#come_funziona_section .cards .card .content p
{
min-height:0;
max-width: 100%;
}
#come_funziona_section .app {
  margin-top: 70px;
	display:block;
text-align:center;
}
#come_funziona_section .app .caption
{
left:0;
}
#come_funziona_section .app .caption span
{
margin-bottom:30px;
margin-left: auto;
margin-right: auto;
}
#come_funziona_section .app img
{
right:9%;
min-width:0;
max-width:100%;
width:350px;
margin-top:60px;
margin-left:auto;
}
footer .focus
{
max-width:400px;
}
footer .col4
{
width:50%;
}
footer .col4.left
{
margin-bottom:40px;
}
footer .col4 .content
{
margin-left:0;
}
#percorso .tabella img
{
margin-top:50px;
}
#professionisti_imprese .tabella, #percorso .tabella
{
width:100%;
}
#professionisti_imprese,#percorso
{
background-size:200% auto;
}
}


@media only screen and (max-width: 767px) 
{
	
h1 {
  font-size: 3.5rem;
  max-width: 420px;
}
#intro p {
  font-size: 1.2rem;
  max-width: 420px;
}
#intro::after
{
height:460px;
margin-top: -60px;
}
#professionisti_imprese::after
{
height:460px;
}
h2 {
font-size: 2.9rem;
}
.steps .step {
    flex-basis: 100%;
  }
  #come_funziona_section .app .caption span {
    font-size: 2.3rem;
  }
#come_funziona_section .app img {
    right: 15%;
}
#professionisti_imprese,#percorso
{
background-size:300% auto;
}
}


@media only screen and (max-width: 480px)
{
#professionisti_imprese,#percorso
{
background-size:400% auto;
}	
 h1 {
    font-size: 2.6rem;
    max-width: 317px;
  }
#intro p {
    font-size: 1.15rem;
    max-width: 317px;
}
h2 {
    font-size: 2.2rem;
  }
.button, a.button
{
font-size: 0.9rem;
}
#intro::after {
    height: 370px;
	margin-top:-50px;
}
#come_funziona_section p {
  font-size: 1rem;
  max-width: 280px;
  margin-left: auto;
  margin-right: auto;
}
.steps .step .ico {
  max-width: 200px;
}
 #come_funziona_section .app .caption span {
    font-size: 1.7rem;
max-width: 305px;
  }
}