.lavoro_container{
  width: 40vw;
  height: 30vh;
  margin: 5px;
  /* border: 1px solid black; */
  background-color: white;
  cursor: pointer;
  border-radius: 20px;
}

.attitudini_container{
  width: 40vw;
  height: 30vh;
  margin: 5px;
  /* border: 1px solid black; */
  background-color: white;
  cursor: pointer;
  border-radius: 20px;
}


.lavoro_container:active{
  background-color: #3264EA!important;
  color: white!important;
  transition: 0.5s;
}

.attitudini_container:active{
  background-color: #3264EA!important;
  color: white!important;
  transition: 0.5s;
}

@keyframes sparisci_fade {
  from {opacity: 1;}
  to {opacity: 0;}
}

.sparisci_fade{
  animation-name: sparisci_fade;
  animation-duration: 0.6s;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
}

@keyframes compari_fade {
  from {opacity: 0;}
  to {opacity: 1;}
}

.compari_fade{
  animation-name: compari_fade;
  animation-direction: linear;
  animation-duration: 0.6s;
  animation-timing-function: ease-in;
    animation-fill-mode: forwards;
}

@keyframes compari_fade_50 {
  from {opacity: 0;}
  to {opacity: 0.3;}
}

.compari_fade_50{
  animation-name: compari_fade_50;
  animation-direction: linear;
  animation-duration: 0.6s;
  animation-timing-function: ease-in;
    animation-fill-mode: forwards;
}

@keyframes compari_fade_100 {
  from {opacity: 0.3;}
  to {opacity: 1;}
}

.compari_fade_100{
  animation-name: compari_fade_100;
  animation-direction: linear;
  animation-duration: 0.6s;
  animation-timing-function: ease-in;
    animation-fill-mode: forwards;
}

.display_none{
  display:none!important;
}

.opacity_0{
  opacity:0;
}

.opacity_50{
  opacity: 0.5;
  cursor: context-menu!important;
}

.opacity_50:hover{
background-color: white!important;
}

.active{
  background-color: red;
}

.body_test{
    background-image: url("assets/mobile_background.png");
  background-repeat: no-repeat;
   /* background-position: -50px!important; */
   background-size: cover;

}



.onboarding{
  position: fixed;
  width: 100vw;
  height: 100vh;
  /* margin: 10vh 9vw; */
  /* border: 1px solid black; */
  /* background-color: white; */
  /* cursor: pointer; */
  /* border-radius: 20px; */
  z-index:2;
}

.img_insetto{
  width: 35vw;
}

.img_logo{
  width:140px!important;
}




@media only screen and (min-width: 900px) {

  /* desktop */

  .domanda{
    width: 50vw;
  }
  .lavoro_container{
    width: 18vw;
    height: 28vh;
    margin: 5px;
    background-color: white;
    cursor: pointer;
    border-radius: 20px;
  }

  .attitudini_container{
    width: 18vw;
    height: 28vh;
    margin: 5px;
    background-color: white;
    cursor: pointer;
    border-radius: 20px;
  }

  .lavoro_container:hover{
    background-color: #3264EA!important;
    color: white!important;
    transition: 0.5s;
  }

  .attitudini_container:hover{
    background-color: #3264EA!important;
    color: white!important;
    transition: 0.5s;
  }

  .body_test{
      background-image: url("assets/Background_light.png");
  }

  .onboarding_text{
    width:50%;
  }

  .pulsanti_demo{
    width: 40%;
  }

  .img_insetto{
    width: 10vw;
  }

  .img_logo{
    width: 15vw!important;
  }

}