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

@media only screen and (max-width: 1200px)
{
#donnavisore {
  left: -45%;
}
}

@media only screen and (max-width: 1023px)
{
.focus {
  width: 80%;
}
#first .focus
{
display:block;
padding-top:70px;
}
#first {
background-image: url("../img/visore_mobile_01.jpg");
max-height:1016px;
background-position:bottom center;
}
#mask {
background-image: url("../img/visore_mobile_02.jpg");
background-position: bottom center;
top: auto;
transform: translateX(-50%);
bottom:0;
}
.cella,.tabella
{
display:block;
}
#page .col2 p, .col2 h2 {
  max-width: 670px;
}
#two p.intro
{
text-transform:uppercase;
}
.blocco_img
{
margin-top:45px;
}
#ten,#thirteen
{
padding-top: 90px;
}
.stats .margine_mob
{
margin-top:30px;
}
#ten .stats p
{
text-align:center;
}
#thirteen > .focus > p
{
height:365px;
}
.icons_area
{
margin-top:0;
justify-content: center;
}
.professione
{
flex-basis:25%;
font-size: 0.75rem;
}
.professione .nome
{
height:31px;
}
}

@media only screen and (max-width: 699px)
{
html {
  font-size: 12px;
}

.focus {
  width: 88%;
}

#page,#first
{
margin-top: 63px;
}
#ten .stats .number-inside-circle
{
height:100px;
}
#ten .stats .number-inside-circle {
  max-width: 127px;
}
.professione {
  flex-basis: 33.333%;
font-size: 0.7em;
padding-top: 100px;
margin-top: 20px;
}
.professione .nome {
  height: 22px;
}
.professione .img::before {
  width: 70px;
  height: 70px;
	background-size: 57%;
}
#thirteen
{
background-size:1000px;
padding-top: 50px;
}
#thirteen .area_drop {
 width: 295px;
height: 295px;
top: 53px;
}
#thirteen p span {
  margin-top: 10px;
}
#thirteen > .focus > p {
  height: 250px;
}
#thirteen img.animation
{
width:486px;
}
.professione .img {
  width: 75px;
}
.professione .overlay
{
width:130px;
}
}
@media only screen and (max-width: 480px)
{	

h1 {
  font-size: 2.5rem;
  line-height: 1.3em;
}
#two p.intro {
  font-size: 1.45rem;
}
h2 {
  font-size: 2.45rem;
}
#four h2,#ten h2 {
  font-size: 2.4rem;
}

#seven p, #eleven p {
  font-size: 2.32rem;
}
#ten .stats .valore_finale
{
width:250px;
height:250px;
}
.stats svg.normal
{
display:none;
}
.stats svg.little
{
display:block;
}
#ten .stats .background-circle {
  border: 41px solid #bd00ff;
}
#thirteen p {
  font-size: 1.95rem;
}
#thirteen p span
{
font-size:1.3rem;
}
#thirteen {
  padding-top: 75px;
}
#thirteen > .focus > p {
  height: 225px;
}
#thirteen .popup
{
padding-bottom: 60px;
}
#close_popup
{
right:auto;
top:auto;
left:50%;
bottom:0;
transform:translateX(-50%);
}
#five .blocco_img,#eight .blocco_img,#nine .blocco_img
{
width:230px;
}
#four .blocco_img
{
width:280px;
margin-left:-50px;
}
#ten .stats .foreground-circle svg circle {
  stroke-dasharray: 660;
  stroke-dashoffset: 660;
}
}