@charset "utf-8";
/* ---------------------RESPONSIVE----------------------------- */
@media only screen and (min-width: 2560px) {
  .cards li {
    width: 50%;
  }
  
}
@media only screen and (max-width: 1440px) {
  .testata, .titolo {
    font-size: 5em;
  }
 
}
@media all and (min-width: 1600px) and (max-width: 1281px) {
  .cards {
    width: 85%;
  }
  p {
    font-size: 12px;
  }  
}
@media all and (min-width: 1024px) and (max-width: 1280px) {
  .cards {
    width: 70%;
    top: 8%;
  }
  p {
    font-size: 12px;
  }  
  /*studio*/
  .titolo {
    font-size: 5em;
    padding: 20px 0 0 30px;
    width: 100%;
  }
}
@media only screen and (max-width: 1024px) {
  .testata, .titolo {
    font-size: 4em;
  }
  .contatti, .contattib {
    font-size: 12px;
  }
}
@media only screen and (max-width: 968px) {  
  .menu {
    margin: 3rem;
  }
  /*studio*/
  .selfb {
    font-size: 1.5rem;
  }
  .menufooter {
    margin-right: 1rem;
  }
}

@media only screen and (max-width: 768px) {
  .cards li {
    width: 96%!important;
  }  
  .menu {
    margin: 2rem;
  }
  .selfa {
    font-size: 1rem;
  }
  .testata, .titolo {
    font-size: 3em;
    line-height: 1;
  }
  .contatti, .contattib {
    font-size: 10px;
  }
  
  .box-testi-stu {
    width: 100%;
    padding-right: 1rem;
    padding-top: 30px;
  }
  .gallery-work {
    margin-top: 170px;
  }
  .gallery {
    margin-top: 170px;
    position: block;
    flex-direction: inherit;
  }
  .galleriastudio {
    margin-top: 170px;
    position: block;
    flex-direction: inherit;
  }
  .scroll-verticale{
    transform: rotate(90deg);
    filter: invert(100%);
    position: fixed;
    bottom: 0;
    right: 200px;
    display: block;
  }
  .scroll-verticale img{
   height: 150px;
   width: auto ;   
  }
  .video{
    
    display: none;
  }

  
}
@media only screen and (min-width: 601px) {
   
    #port-folio img{
     width: 50vw;
     height: 100%;
    }
    .mobile,
    .mobilet,
    .mobile-scroll{
      display: none;
    }
    /*studio*/
  .titolo {
    font-size: 5em;
    padding: 20px 0 0 30px;
    width: 100%;
  }
  
}
    
  /* Extra small devices (phones, 600px and down) */
  @media only screen and (max-width: 600px) {
  .dekstop{
    display: none;
  }
  
    .box {
        display: flex;
        flex-wrap: wrap;
        min-height: calc(100vh - 100px);
    }

  
  .mobile{
    position: fixed;
    top: 30px;
    left: 5px;
    z-index: 999;
  }
  .mobilet{
    overflow: hidden;
    position: fixed;
    top: 0px;
    width: 100%;
    background-color: #fff;
    padding: 30px 0;
    z-index: 99999;
  }
  .menu-mobile{
    display: flex;
    flex-wrap: wrap;
  }
  .logo-mobile,.ancore-mobile,.testo-home-mobile{
    width: 100%;
    margin: 4px;
    display: flex;
  }
  .logo-mobile img{
    padding-bottom: 10px;
  }
  .logo-mobile{
    justify-content: center;
  }
  .ancore-mobile{
  justify-content: space-around;
  }
  .testo-home-mobile p {
  font-size: 13px;
  margin: 20px;
  }
  .cards {
    position: absolute;
    top: 15%;
  }
  .text-left, .text-rigth {
    font-family: 'Self Modern';
    font-size: 12px;
  }
  .box-testi {
    position:inherit;
    width: 100%;
  }
  .box-galleria {
    display: flex;
    flex-direction:inherit;
    width: 100%;
  }
  .progetto {
    width: 100%;
    padding: 0;
  }    
  section .scroll div {
    font-size: 14px;
  }
  /******Contatti********/
  .testata,
  .titolo{
  font-size: 22px;
  line-height: 20px;
  }
  .testata>h2{
    display: none;
  }
  .flex {
    flex-wrap: wrap;
    width: 100%;
  }
  .self {
    font-family: 'Self Modern';
    width: 100%;
    margin: 0;
  }
  .free h2 {
    margin:0;
  }
  .contatti, .contattib {
    padding-right: 3em;
    font-size: 18px;
    font-family: 'GT-America-Expanded-regular';
    width: 100%;
    margin-top: 0px;
  }
  #centow {
    height: auto;
    overflow: inherit;
  }
  .mobile-scroll{
  margin:35px auto;
  }
  .flexb {
    width: 100%;
    margin: 0 2%;
  }
  .work {
    display: flex;
    align-items: flex-start;
    width: 100%;
  }
  .col2 {
    display: flex;
    flex-wrap: wrap;
  }
  .titolo {
    font-size: 42px;
  }
  .contact{
    background-color: #fff; 
    justify-content: center;
  } 
}