/* ---MOBILE START-------*/


#mobile_home1 {
  width:100%;
  height:100vh;
  position:relative;
  padding:0px 0px 0px 0px;
  margin:0px 0px 0px 0px;
  border:2px solid #f26008;
  background: transparent url(../images/mobile/mobile_home1.jpg);
  background-size: 100%;
  background-position: center center;
  background-repeat: no-repeat;
}
#mobile_home2 {
  width:100%;
  min-height:150px;
  position:relative;
  padding:0px 0px 0px 0px;
  margin:0px 0px -40px 0px;
  border:0px solid #f26008;
  background: transparent url(../images/mobile/mobile_home2.jpg);
  background-size: contain;
  background-position: center left;
  background-repeat: no-repeat;
  }
#mobile_home3 {
  width:100%;
  height:150px;
  position:relative;
  padding:0px 0px 0px 0px;
  margin:0px auto;
  border:2px solid #f26008;
  background: #161514 url(../images/mobile/mobile_home3.jpg);
  background-size: contain;
  background-position: center left;
  background-repeat: no-repeat;
  top:0px;
  z-index:3;
  }
  #mobile_home4 {
    width:100%;
    min-height:150px;
    position:relative;
    padding:0px 0px 0px 0px;
    margin:0px 0px -40px 0px;
    border:0px solid #f26008;
    background: transparent url(../images/mobile/mobile_home4.jpg);
    background-size: contain;
    background-position: center left;
    background-repeat: no-repeat;
    }
    #mobile_home5 {
      width:100%;
      min-height:90vh;
      position:relative;
      padding:0px 0px 0px 0px;
      margin:0px 0px 0px 0px;
      border:0px solid #f26008;
      background: transparent url(../images/mobile/mobile_home5.jpg);
      background-size: cover;
      background-position: center center;
      background-repeat: no-repeat;
      }
      #mobile_home6 {
        width:100%;
        min-height:400px;
        position:relative;
        padding:0px 0px 0px 0px;
        margin:0px 0px 0px 0px;
        border:0px solid #f26008;
        background: transparent url(../images/mobile/mobile_home6.png);
        background-size: cover;
        background-position: top center;
        background-repeat: no-repeat;
        z-index:4;
        }
        #mobile_home7 {
          width: 100%;
          min-height: 150px;
          position: relative;
          padding: 0px 0px 0px 0px;
          margin: 0px 0px 0px 0px;
          border: 0px solid #f26008;
          background: transparent url(../images/mobile/mobile_home7.png);
          background-size: contain;
          background-position: top left;
          background-repeat: no-repeat;
          z-index: 4;
          }


    #frame_img2 {
      width: 100%;
      height: 30vh;
      background: transparent url(../images/graphic/sketch2.png) no-repeat;
      background-size: 100%;
      background-position: bottom center;
      z-index: 3;
      padding: 0px 0px 0px 0px;
      transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
      position: relative;
      overflow: visible;
      margin: 0px auto;
      top: 0vh;
    }
    #frame_img3 {
      width: 100%;
      height: 30vh;
      background: transparent url(../images/graphic/sketch3.png) no-repeat;

      background-size: 100%;
      background-position: bottom center;
      z-index: 3;
      padding: 0px 0px 0px 0px;
      transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
      position: absolute;
      overflow: visible;
      margin: 0px auto;
      bottom: 0vh;
    }
#mobile_servizi1 {
  width: 100%;
  height: 60px;
  position: relative;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px;
  border: 0px solid #f26008;
  background: transparent url(../images/mobile/mobile_servizi1.jpg);
  background-size: contain;
  background-position: top right;
  background-repeat: no-repeat;
}
#mobile_servizi2 {
  width: 100%;
  height: 60px;
  position: relative;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px;
  border: 0px solid #f26008;
  background: transparent url(../images/mobile/mobile_servizi2.jpg);
  background-size: contain;
  background-position: top right;
  background-repeat: no-repeat;
}
#mobile_servizi3 {
  width: 100%;
  height: 60px;
  position: relative;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px;
  border: 0px solid #f26008;
  background: transparent url(../images/mobile/mobile_servizi3.jpg);
  background-size: contain;
  background-position: top right;
  background-repeat: no-repeat;
}
#mobile_servizi4 {
  width: 100%;
  height: 60px;
  position: relative;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px;
  border: 0px solid #f26008;
  background: transparent url(../images/mobile/mobile_servizi4.jpg);
  background-size: contain;
  background-position: top right;
  background-repeat: no-repeat;
}
#mobile_servizi5 {
  width:60px;
  height:60px;
  position:relative;
  padding:0px 0px 0px 0px;
  margin:0px auto;
  border:0px solid #f26008;
  background: transparent url(../images/mobile/mobile_servizi5.jpg);
  background-size: contain;
  background-position: top center;
  background-repeat: no-repeat;
}

#mobilebg-circle2 {
  background: #f26008;
  background-repeat: no-repeat;
  background-size:contain;
  background-position: center center;
  min-height: 0vh;
  margin: 0px 0px 0px 0px;
  width: 100%;
  }
#mobile-mainback2 {
  width: 100%;
  height: 50vh;
  border: 0px solid #f26008;
  border-left: none;
  border-right: none;
  position: relative;
  display: block;
  overflow: visible;
  z-index: 1;
  background: transparent;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 0% 0%;
  transition: 2s, background-position 2s 1s, width 2s ease, height 1s 500ms, padding 1s;
  float: left;
  margin:0px 0px 0px 0px;
  }


    #desktopbg-circle3 {
      background: #f26008;
      background-repeat: no-repeat;
      background-size:contain;
      background-position: center center;
      min-height: 80vh;
      margin: 0px 0px 0px 0px;
      width: 100%;
      position:absolute;
      }
      #desktop-mainback3 {
        width: 100%;
        height: 80vh;
        border: 0px solid #f26008;
        border-left: none;
        border-right: none;
        position: relative;
        display: block;
        overflow: visible;
        z-index: 1;
        background: transparent;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: 0% 0%;
        transition: 2s, background-position 2s 1s, width 2s ease, height 1s 500ms, padding 1s;
        float: left;
        margin:0px 0px 0px 0px;
        }

  #mobilebg-circle3 {
    background: #f26008;
    background-repeat: no-repeat;
    background-size:contain;
    background-position: center center;
    min-height: 600px;
    margin: -150px 0px 0px 0px;
    width: 100%;
    position:absolute;
    }

  #mobile-mainback3 {
    width: 100%;
    height: 600px;
    border: 0px solid #f26008;
    border-left: none;
    border-right: none;
    position: relative;
    display: block;
    overflow: visible;
    z-index: 1;
    background: transparent;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 0% 0%;
    transition: 2s, background-position 2s 1s, width 2s ease, height 1s 500ms, padding 1s;
    float: left;
    margin:0px 0px 0px 0px;
    }


/* ----INTERSECTION OBSERVER START-------*/
.ob_container {
overflow:visible;
/*   display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 0px; */
}
.ob_container h4{
  font-size: 2em;
  color: #f26008;
  text-align: center;
  font-weight: bold;
  font-family: (sans serfi, tahma);
  letter-spacing: 1px;
  line-height: 89%;
  }
.ob_container p{
  font-size: 1em;
  color: #9d9a97;
  text-align: left;
  font-weight: 300;
  font-family: (sans serfi, tahma);
  letter-spacing: 1px;
  line-height: 115%;
  }

.ob_box {
  width: 90%;
  min-height: 200px;
  border:0px solid #f26008;
  border-radius:1vh;
  margin: 30px auto;
  padding: 0px 0px;
  background-color: transparent;
  opacity: 0;
  transform: translateY(150px); /* Spostato verso il basso */
  transition: opacity 1.5s ease, transform 1.5s ease; /* Transizione per l'animazione */
}
.ob_box.visible {
  opacity: 1; /* Diventa visibile */
  transform: translateY(0); /* Torna alla posizione originale */
}

/* ----INTERSECTION OBSERVER END-------*/

/* ----MOBILE END----------------------*/




/* ----P5 SKETCK START-------*/
#sketp5_1 {
  width:100%;
  height:80vh;
  border: 2px solid rgb(0, 26, 255);
  overflow:hidden;
  background: transparent;
  position: absolute;
  right: 0;
  top: 0;
  float: right;
  display:block;
  z-index:9999;
}
#tools {
width: auto;
  height: auto;
  background: transparent;
  z-index: 9;
  padding: 0vh 0vh;
  position: relative;
  overflow: visible;
  float: left;
  top:-45px;
}
#tools_desk {
  width: 100%;
  height: 100%;
  background: transparent;
  z-index: 9;
  padding: 0px 0px;
  position: relative;
  overflow: visible;
  float: right;
}

#tools2 {
  width: 57%;
  height: 100%;
  background: transparent;
  z-index: 3;
  padding: 0vh 0vh 0vh 0vh;
  transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
  position: relative;
  overflow: visible;
  right: 5vh;
  float: right;
}

#tools2 p {
  width: 65%;
  float: none;
  font-size: 1em;
  color: #f26008;
  font-weight: bold;
  padding: 5vh;
  transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
  line-height: 110%;
  position: relative;
  margin: 0px auto;
  right: 0vh;
  background: transparent;
  border-radius: 1vh;
  border: 0px solid #161514;
}
#bg-circle14 {
  background: transparent url(../images/graphic/circle_bg14.jpg);
  background-repeat: no-repeat;
  background-size: 90%;
  background-position: 50% 50%;
  height: auto;
  margin: 0px 0px 0px 0px;
  overflow: visible;
  width: 100%;
  transition:8s ease;
}
#bg-circle14:hover {
  background-size: 110%;
}
  #bg-circle14  p {
width: 100%;
  text-align: right;
  font-size: 1em;
  line-height: 120%;
  color: #fff;
  padding: 20px 20px;
  margin: 0px auto;
  background: transparent;
  height: auto;
  border-radius: 1vh;
  z-index: 9;
  right: 0;
  bottom: 0px;
  position: absolute;
  }

  #tools_img {
    width: 100%;
    height: 50%;
    background: transparent url(../images/graphic/tools.png) no-repeat;
    background-size: 101%;
    background-position: bottom center;
    z-index: 9;
    padding: 0px 0px 0px 0px;
    transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
    position: absolute;
    overflow: visible;
    margin: 0px auto;
    bottom: 0;
  }
  #tools_img_desk1 {
    background: transparent;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 100% 50%;
    height: 100%;
    margin: 0px 0px 0px 0px;
    overflow: visible;
  }

  #tools_img_desk2  {
    width: 238px;
    height: 153px;
    position: relative;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
    border: 0px solid #f26008;
    background: transparent url(../images/mobile/tools_img_desk2.png);
    background-position-x: 0%;
    background-position-y: 0%;
    background-repeat: repeat;
    background-size: auto;
    background-size: contain;
    background-position: top;
    background-repeat: no-repeat;
  }
  #tools_img_desk3 {
    width: 369px;
    height: 36vh;
    position: absolute;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 40px 5px;
    border: 0px solid #f26008;
    background: transparent url(../images/mobile/tools_img_desk3.png);
    background-size: contain;
    background-position: right top;
    background-repeat: no-repeat;
    bottom: 0;
    right: 0;
    }
    #tools_img_desk3b {
      width: 369px;
      height: 36vh;
      position: absolute;
      padding: 0px 0px 0px 0px;
      margin: 0px 0px 40px 5px;
      border: 0px solid #f26008;
      background: transparent url(../images/mobile/tools_img_desk3b.png);
      background-size: contain;
      background-position: left top;
      background-repeat: no-repeat;
      bottom: 0;
      left: 0;
      }

      #tools_img_desk3c {
        width: 369px;
        height: 36vh;
        position: absolute;
        padding: 0px 0px 0px 0px;
        margin: 10px 0px 0px 50px;
        border: 0px solid #f26008;
        background: transparent url(../images/mobile/tools_img_desk3c.png);
        background-size: contain;
        background-position: left top;
        background-repeat: no-repeat;
        top: 0;
        left: 0;
        }

    #tools_img_desk4  {
      width: 369px;
      height: 36vh;
      position: absolute;
      padding: 0px 0px 0px 0px;
      margin: 10px 0px 0px 10px;
      border: 0px solid #f26008;
      background: transparent url(../images/mobile/tools_img_desk4.png);
      background-size: contain;
      background-position: left top;
      background-repeat: no-repeat;
      top: 0;
      }

      #tools_img_desk5  {
        height: 80vh;
        position: relative;
        padding: 0px 0px 0px 0px;
        margin: 0px 0px 0px 0px;
        border: 0px solid #f26008;
        background: transparent url(../images/mobile/tools_img_desk5.png);
        background-size: cover;
        background-position: center center;
        background-repeat: no-repeat;
        overflow: visible;
        z-index:4;
        }


      #tools_img_desk5a  {
        height: 40vh;
        position: relative;
        padding: 0px 0px 0px 0px;
        margin: 0px 0px 0px 0px;
        border: 0px solid #f26008;
        background: transparent url(../images/mobile/tools_img_desk5a.png);
        background-size: contain;
        background-position: top center;
        background-repeat: no-repeat;
        overflow: visible;
        }


        #tools_img_desk5b  {
          height: 40vh;
          position: relative;
          padding: 0px 0px 0px 0px;
          margin: 0px 0px 0px 0px;
          border: 0px solid #f26008;
          background: transparent url(../images/mobile/tools_img_desk5b.png);
          background-size: contain;
          background-position: bottom center;
          background-repeat: no-repeat;
          overflow: visible;
        }




canvas {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:60vh;
  z-index:9;
}
/* ----P5 SKETCK END-------*/

#megabox {
background:#161514;
background-repeat:repeat-x;
background-size: 180vh;
background-position:bottom center;
margin: 0px auto;
overflow: hidden;
border: 0px solid #f26008;
padding:0px 0px 0px 0px;
}


#bg-circle{
background: #161514 url(../images/graphic/circle_bg.jpg);
background-repeat: no-repeat;
background-size: 100%;
background-position: top left;
min-height: 80vh;
margin: 0px 0px 0px 0px;
overflow: visible;
width: 100%;
}
#bg-circle2{
background: #161514 url(../images/graphic/circle_bg2.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: 100% 0%;
min-height: 81vh;
margin: 0px 0px 0px 0px;
overflow:visible;
width: 100%;
}
#bg-circle3{
background: #f26008;
background-repeat: no-repeat;
background-size:contain;
background-position: center center;
min-height: 81vh;
margin: 0px 0px 0px 0px;
width: 100%;
}
#bg-circle3 p {
  max-width: 400px;
  float: none;
  font-size: 1em;
  color: #161514;
  font-weight: bold;
  padding: 0px 0px 0px 10px;
  line-height: 110%;
  position: relative;
  margin: 0px auto;
  right: 0vh;
  background: #f2600854;
  border-radius: 1vh;
  border: 0px solid #161514;
  text-align: left;
}
#bg-circle4 {
background: #f26008 url(../images/graphic/circle_bg4.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
min-height: 80vh;
margin: 0px 0px 0px 0px;
width: 100%;
}
#bg-circle5 {
background: #f26008;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 0% 100%;
  min-height: 80vh;
  margin: 0px 0px 0px 0px;
  width: 100%;
}
#bg-circle6 {
background: #f26008 url(../images/graphic/circle_bg6.jpg);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: top right;
  min-height: 80vh;
  margin: 0px 0px 0px 0px;
  width: 100%;
  border-right: 20px solid #161514;
}
#bg-circle7 {
background: #f26008;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: top right;
  min-height: 80vh;
  margin: 0px 0px 0px 0px;
  width: 100%;
  border-right: 20px solid #161514;
}
#bg-circle8 {
background: #f26008;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: top right;
  min-height: 80vh;
  margin: 0px 0px 0px 0px;
  width: 100%;
}
#bg-circle9 {
background: #f26008;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: top right;
  min-height: 80vh;
  margin: 0px 0px 0px 0px;
  width: 100%;
}
#bg-circle10 {
background: #f26008;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: top right;
  min-height: 80vh;
  margin: 0px 0px 0px 0px;
  width: 100%;
}
#bg-circle11 {
background: transparent;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: top right;
  min-height: 80vh;
  margin: 0px 0px 0px 0px;
  width: 100%;
}
#bg-circle12 {
background: transparent;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: top right;
  min-height: 80vh;
  margin: 0px 0px 0px 0px;
  width: 100%;
}
#bg-circle13 {
background: transparent;
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: top right;
  min-height: 80vh;
  margin: 0px 0px 0px 0px;
  width: 100%;
}
#bg-circle15 {
  background: #161514 url(../images/graphic/circle_bg15.jpg);
  background-repeat: no-repeat;
  background-size: 160%;
  background-position: -50% 50%;
  min-height: 80vh;
  margin: 0px 0px 0px 0px;
  width: 100%;
  transition: 12s;

}

  #bg-circle15:hover {
    background-position: 100% 50%;

  }

  #bg-circle15  p {
width: 341px;
  text-align: left;
  font-size: 1em;
  line-height: 120%;
  color: #fff;
  padding: 20px 15px;
  margin: 0px 0px;
  background: transparent;
  position: absolute;
  height: auto;
  border-radius: 0vh 0vh 1vh 1vh;
  border: 0px solid #f26008;
  z-index: 9;
  left: 0%;
  bottom: 0px;
  }


  #bg-circle16 {
    background: #161514;
    background-repeat: no-repeat;
    min-height: 80vh;
    margin: 0px 0px 0px 0px;
    width: 100%;
  }
  #bg-circle16  p {
width: auto;
  text-align: left;
  font-size: 1.5em;
  line-height: 120%;
  color: #ff8000;
  padding: 20px;
  margin: 0px 0px 0px -55px;
  background: #161514c4;
  position: absolute;
  height: auto;
  border-radius: 1vh;
  border: 0px solid #f26008;
  z-index: 9;
  left: 0%;
  top: 0;
  font-weight: bold;

  }


#box-circle {overflow:visible;padding:0px 0px 0px 20px;}
#box-circle2 {overflow:visible;padding:0px 0px 0px 20px;}
#box-circle3 {overflow:visible;position:relative;}
#box-circle4 {overflow:visible;padding:0px 0px 0px 20px;}
#box-circle5 {overflow:visible;padding:0px 0px 0px 20px;}

#box-circle3 h3{
  color: white;
  font-size: 9vh;
  letter-spacing: 4px;
  margin: 0px 0px 0px 0px;
  text-align: right;
  width: 100%;
  background: transparent;
  border: 0px solid #f26008;
  border-radius: 20px 20px 20px 20px;
  position: absolute;
  left: -6vh;
  top: 7vh;
  padding: 0px 0px 0px 0px;
  transition: 2s, top 2s 2s, left 2s;
}
#box-circle3:hover h3{
text-shadow: 1px 0px 4px #EEECE3F2, 2px 1px 3px #FFD5FF, 2px 0px 2px #5c556a, 2px 0px 55px, 5px 0px 100px, 20px 0px 200px #D42C2C,40px 0px 200px #D42CCA;
}




#mainback, #mainback2, #mainback3, #mainback4, #mainback5, #mainback6,
#mainback7, #mainback8, #mainback9, #mainback10, #mainback11, #mainback12, #mainback13, #mainback14, #mainback15,
#mainback16 {
width: 100%;
height: 81vh;
border: 2px solid #f26008;
border-left: none;
position: relative;
display: block;
margin: 0px 0px 0px 0px;
overflow: visible;
z-index: 1;
background: transparent;
background-repeat: no-repeat;
background-size: cover;
background-position: 0% 0%;
transition: 2s, background-position 2s 1s, width 2s ease, height 1s 500ms, padding 1s;
float: left;
}

#text-circle {
border-radius: 1vh;
  width: 9vh;
  height: 9vh;
  border: 2px solid #f26008;
  position: absolute;
  display: block;
  margin: 0px 0px 30px 20px;
  overflow: hidden;
  z-index: 4;
  background: #161514 url(../images/graphic/textcircle_bg.jpg);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: 90% 50%;
  transition: 2s, background-position 5s 1s, width 2s ease, height 1s 500ms, padding 1s;
  float: left;
  top: 9vh;
  left:0px;
  cursor: pointer;
}
#text-circle2{
border-radius: 1vh;
  width: 9vh;
  height: 9vh;
  border: 2px solid #f26008;
  position: absolute;
  display: block;
  margin: 0px 0px 30px 20px;
  overflow: hidden;
  z-index: 4;
  transition: 2s, background-position 2s 1s, width 2s, height 2s 1s, z-index 2s, padding 2s, transform 2s, top 2s, right 2s, border-radius 200ms, border 2s;
  background: #16151433 url(../images/graphic/textcircle_bg2.jpg);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: 90% 50%;
top: 20vh;left:0px;
cursor:pointer;
}
#text-circle3 {
  top: 5vh;
  left: 1vw;
  width: 98vw;
  height: 90vh;
  position: absolute;
  display: block;
  overflow: hidden;
  border: 2px solid #f26008;
  border-radius: 20px 20px 20px 20px;
  padding: 0px 50px 0px 50px;
  background: #161514 url()no-repeat;
  background-size: 100%;
  background-position:center center;
  box-shadow: 0px 0px 55px 5px #000000ba, 0px 120px 190px 0px #000, 0px 0px 100px 5px #161514 inset, 0px 0px 30px 10px #161514 inset;
  cursor: pointer;
  z-index: 9;
  float: right;
  transition: 3s, height 2s 2s, width 2s, top 2s 2s;
}
.open-circle3 {
width: 5vh !important;
  height: 5vh !important;
  top: 5px !important;
  padding: 0px 0px 0px 0px !important;
  background: transparent !important;
  box-shadow: 9px 9px 38px #090808, -9px -9px 38px #232220 !important;
  transition: 3s, left 2s 2s, width 2s 2s, top 2s !important;
  left: 0vh !important;
  border-radius: 0px 12px 12px 0px !important;
  position: absolute !important;
}
.open-circle3 h3 {
  color: white !important;
  letter-spacing: 4px !important;
  line-height: 45% !important;
  margin: 0px 0px 0px 0px !important;
  text-align: right !important;
  width: 100% !important;
  background: transparent !important;
  border: 0px solid #f26008 !important;
  border-radius: 20px 20px 20px 20px !important;
  position: absolute !important;
  left: -0.5vh !important;
  top: -2vh !important;
  padding: 0px 0px 0px 0px !important;
  transition: 2s !important;
}

.open-circle3 p {
text-align: center;
  font-size: 3vw;
  font-family: sans;
  padding: 10vh 10vh 0vh 10vh;
  color: #f26008;
  font-weight: bold;
  line-height: 1;
  width: 100%;
  border-radius: 0px 0px 0px 0px;
  background: transparent;
  float: none;
  left: 0vh;
  top: 14vh;
}


#text-circle4 {
border-radius: 1vh;
  width: 9vh;
  height: 9vh;
  border: 2px solid #f26008;
  position: absolute;
  display: block;
margin: 0px 0px 30px 20px;
  overflow: hidden;
  z-index: 4;
  transition: 2s, background-position 2s 1s, width 2s ease, height 1s 500ms, padding 1s;
  background: #161514 url(../images/graphic/textcircle_bg.jpg);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: 90% 50%;
top: 31vh;left:0px;
cursor:pointer;
}
#text-circle4:visited {
z-index:5;
}
#text-circle5 {
border-radius: 1vh;
  width: 9vh;
  height: 9vh;
  border: 2px solid #f26008;
  position: absolute;
  display: block;
  margin: 0px 0px 30px 20px;
  overflow: hidden;
  z-index: 4;
  transition: 2s, background-position 2s 1s, width 2s, height 2s 1s, z-index 2s, padding 2s, transform 2s, top 2s, right 2s, border-radius 200ms, border 2s;
  background: #161514 url(../images/graphic/textcircle_bg2.jpg);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: 90% 50%;
  top: 42vh;
  left:0px;
  cursor:pointer;
}
#box-text-circle {
  max-width: 400px;
  width: 83%;
  bottom: 12vh;
  right: 0;
  background: #1615149c;
  padding: 30px 20px 30px 20px;
  margin: 0px 0px 0px 0px;
  position: absolute;
  float: right;
  border-radius:1vh 0vh 0vh 1vh;
  border: 2px solid #1615149c;
}
#box-text-circle:hover {
  animation: boxtext-border 3s alternate
}

#box-text-circle p {
  letter-spacing: 0px;
  padding: 0px 0px 0px 0px;
  border-radius: 8px;
  text-align: right;
  font-size: 15px;
  font-weight: bold;
  margin: 0px 0px 0px 0px;
}



/* ----1 2 3 4 home -------*/
#text-circle h3 {
color: white;
  font-size: 5vh;
  line-height: 1;
  margin: 0px auto;
padding: 0.399em 0.5em 0em 0em;
  text-align: right;
  width: auto;
  float: none;
  position: relative;
}
#text-circle2 h3  {
color: white;
  font-size: 5vh;
  line-height: 1;
  margin: 0px auto;
padding: 0.399em 0.5em 0em 0em;
  text-align: right;
  width: auto;
  float: none;
  position: relative;
}

#text-circle4 h3  {
color: white;
  font-size: 5vh;
  line-height: 1;
  margin: 0px auto;
padding: 0.399em 0.5em 0em 0em;
  text-align: right;
  width: auto;
  float: none;
  position: relative;
}
#text-circle5 h3 {
color: white;
  font-size: 5vh;
  line-height: 1;
  margin: 0px auto;
padding: 0.399em 0.5em 0em 0em;
  text-align: right;
  width: auto;
  float: none;
  position: relative;
}



.open-circle {
  border-radius: 1vh !important;
  width: 90% !important;
  height: 90vh !important;
  overflow: hidden;
  padding: 50px 50px 50px 50px;
  display: block;
  box-shadow: 0px -10px 40px 0px #000, 0px 0px 100px 50px #161514 inset, 0px 0px 50px 0px #161514 inset !important;
  background-position: 0% 50% !important;
  border: 2px solid #161514 !important;
left: 5vh !important;
  top: -5vh !important;
  margin:0px 0px 0px 0px !important;
}
.open-circle2 {
  border-radius: 20px !important;
  width: 90% !important;
  height: 90vh !important;
  overflow: hidden;
  padding: 50px 50px 50px 50px;
  display: block;
  background-position: 15% 50% !important;
  border: 2px solid #161514 !important;
  box-shadow: 0px -10px 40px 0px #000, 0px 0px 100px 50px #161514 inset, 0px 0px 50px 0px #161514 inset !important;
left: 5vh !important;
  top: -5vh !important;
  margin:0px 0px 0px 0px !important;
}

.open-circle4 {
  border-radius: 20px !important;
  width: 90% !important;
  height: 90vh !important;
  overflow: hidden;
  padding: 50px 50px 50px 50px;
  display: block;
  box-shadow: 0px -10px 40px 0px #000, 0px 0px 100px 50px #161514 inset, 0px 0px 50px 0px #161514 inset !important;
  background-position: 0% 50% !important;
  border: 2px solid #161514 !important;
left: 5vh !important;
  top: -5vh !important;
  margin:0px 0px 0px 0px !important;
}
.open-circle5 {
  border-radius: 20px !important;
  width: 90% !important;
  height: 90vh !important;
  overflow: hidden;
  padding: 50px 50px 50px 50px;
  display: block;
  background-position: 0% 50% !important;
  border: 2px solid #161514 !important;
  box-shadow: 0px -10px 40px 0px #000, 0px 0px 100px 50px #161514 inset, 0px 0px 50px 0px #161514 inset !important;
left: 5vh !important;
  top: -5vh !important;
  margin:0px 0px 0px 0px !important;
}



/* ----5 6 7 8 9 10gallery-------*/

/* MOBILE HOME CIRCLES START */




#mobile-servizi1  {
  width: 9vh;
  height: 9vh;
  border: 2px solid #f26008;
  border-left: none;
  border-radius: 0vh 1vh 1vh 0vh;
  position: absolute;
  display: block;
  overflow: hidden;
  z-index: 4;
  background: #161514 url(../images/mobile/mobile_textcirclebg.jpg) no-repeat;
  background-size: auto;
  background-position: 90% 50%;
  transition: 2s, left 200ms, border-radius 200ms, background-position 2s 1s, width 2s ease, height 1s 500ms, padding 1s, border-left 2s;  float: left;
  margin: 0px 0px 30px 0px;
  top: 9vh;
  left: -0%;
  cursor: pointer;
}
#mobile-servizi2  {
  width: 9vh;
  height: 9vh;
  border: 2px solid #f26008;
  border-left: none;
  border-radius: 0vh 1vh 1vh 0vh;  position: absolute;
  display: block;
  margin: 0px 0px 30px 0px;
  overflow: hidden;
  z-index: 4;
  transition: 2s, left 200ms, border-radius 200ms, background-position 2s 1s, width 2s ease, height 1s 500ms, padding 1s, border-left 2s;
  background: #161514 url(../images/mobile/mobile_textcirclebg.jpg) no-repeat;
  background-size: auto;
  background-position: 90% 50%;
  top: 20vh;left:-0%;
  cursor:pointer;
}
#mobile-servizi3  {
  width: 9vh;
  height: 9vh;
  border: 2px solid #f26008;
  border-left: none;
  border-radius: 0vh 1vh 1vh 0vh;
  position: absolute;
  display: block;
margin: 0px 0px 30px 0px;
  overflow: hidden;
  z-index: 4;
  transition: 2s, left 200ms, border-radius 200ms, background-position 2s 1s, width 2s ease, height 1s 500ms, padding 1s, border-left 2s;
  background: #161514 url(../images/mobile/mobile_textcirclebg.jpg) no-repeat;
  background-size: auto;
  background-position: 90% 50%;
  top: 31vh;left:-0%;
  cursor:pointer;
}
#mobile-servizi4  {
  width: 9vh;
  height: 9vh;
  border: 2px solid #f26008;
  border-left: none;
  border-radius: 0vh 1vh 1vh 0vh;  position: absolute;
  display: block;
  margin: 0px 0px 30px 0px;
  overflow: hidden;
  z-index: 4;
  transition: 2s, left 200ms, border-radius 200ms, background-position 2s 1s, width 2s ease, height 1s 500ms, padding 1s, border-left 2s;
  background: #161514 url(../images/mobile/mobile_textcirclebg.jpg) no-repeat;
  background-size: auto;
  background-position: 90% 50%;
top: 42vh;left:0%;
  cursor:pointer;
}
#mobile-servizi1 h3, #mobile-servizi2 h3, #mobile-servizi3 h3, #mobile-servizi4 h3 {
  color: white;
    font-size: 5vh;
    line-height: 1;
    margin: 0px auto;
  padding: 0.399em 0.5em 0em 0em;
    text-align: right;
    width: auto;
    float: none;
    position: relative;
  }
  #mobile-servizi1 p, #mobile-servizi2 p, #mobile-servizi3 p, #mobile-servizi4 p {
    width:100%;
    border-radius: 1vh 1vh 0vh 0vh;
    background: transparent;
    letter-spacing: 0px;
    line-height: 121%;
    color: #e3dcbf;
    font-size: 3.8vw;
    font-weight: bold;
    text-align: right;
    position: absolute;
    padding: 30px 10px 30px 80px;
    margin: 10px 0px 0px 0px;
    right: 0px;
  }
.open-servizi1, .open-servizi2, .open-servizi3, .open-servizi4,
.open-servizi5, .open-servizi6, .open-servizi7 {
  z-index:5 !important;
  border-radius: 20px !important;
  width: 100% !important;
  height: 90vh !important;
  overflow: hidden;
  display: block;
  border: 2px solid #161514 !important;
  box-shadow: 0px -10px 40px 0px #000, 0px 0px 100px 50px #161514 inset, 0px 0px 50px 0px #161514 inset !important;
  top: -5vh !important;
  margin: 0px 0px 0px 0px !important;
  left:0% !important;
}
/* MOBILE HOME CIRCLES END */


.open-circle9, .open-circle10, .open-circle11, .open-circle12, .open-circle13, .open-circle14,
.open-circle15, .open-circle16, .open-circle18,.open-circle19, .open-circle20, .open-circle21,
.open-circle22, .open-circle23, .open-circle24, .open-circle25, .open-circle26, .open-circle27,
.open-circle28, .open-circle29, .open-circle30, .open-circle31, .open-circle32, .open-circle33,
.open-circle34, .open-circle35, .open-circle36, .open-circle37, .open-circle38, .open-circle39,
.open-circle40, .open-circle41, .open-circle42, .open-circle43, .open-circle44, .open-circle45,
.open-circle46, .open-circle47, .open-circle48, .open-circle49, .open-circle50, .open-circle51,
.open-circle52, .open-circle53, .open-circle54, .open-circle55, .open-circle56, .open-circle57,
.open-circle58, .open-circle59, .open-circle60, .open-circle61, .open-circle62, .open-circle63,
.open-circle64, .open-circle65,  .open-circle66, .open-circle67, .open-circle68, .open-circle69,
.open-circle70, .open-circle71   {
  z-index:5 !important;
  border-radius: 20px !important;
  width: 100% !important;
  height: 90vh !important;
  overflow: hidden;
  display: block;
  border: 2px solid #161514 !important;
  box-shadow: 0px -10px 40px 0px #000, 0px 0px 100px 50px #161514 inset, 0px 0px 50px 0px #161514 inset !important;
  top: -5vh !important;
  margin: 0px 0px 0px 0px !important;
  left:0% !important;
}

.close-circle {margin:0 0;}

#monitor {
width: 33vw;
  height: 43vh;
  padding: 0px 0px;
  margin: 9vw 0vw 0vw 2vw;
  position: relative;
  border: 25px solid #222020;
  border-radius: 20px;
  background: #161514;
  float: left;
  overflow: hidden;
  top: 5%;

}

/* ----section bg 5 ------*/

#monitor-photo1 {
width: 45vh;
  height: 45vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: right;
  background: #161514 url(../images/sections/photo1.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  top: -2px;
  left: 2vh;
  z-index: 1;
}

.open-circle6 {
  background-size: contain !important;
  z-index:5 !important;
  border-radius: 20px !important;
  width: 70vw !important;
  height: 90vh !important;
  overflow: hidden;
  display: block;
  border: 2px solid #161514 !important;
  box-shadow: 0px -10px 40px 0px #000, 0px 0px 100px 50px #161514 inset, 0px 0px 50px 0px #161514 inset !important;
  top: -5vh !important;
  margin: 0px 0px 0px 0px !important;
  left:0vh !important;
}
#monitor-photo2 {
width: 34vh;
  height: 34vh;
  margin: 0 0;
  position: absolute;
 border: 2px solid #161514;
  float: right;
  background: #161514 url(../images/sections/photo2.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 3px 0px black;
  bottom: -2px;
  left: 2vh;
  z-index: 1;
}

.open-circle7 {
  z-index:5 !important;
  border-radius: 20px !important;
  width: 70vw !important;
  height: 90vh !important;
  overflow: hidden;
  display: block;
  border: 2px solid #161514 !important;
  box-shadow: 0px -10px 40px 0px #000, 0px 0px 100px 50px #161514 inset, 0px 0px 50px 0px #161514 inset !important;
  bottom: -5vh !important;
  right:0% !important;
  margin: 0px 0px 0px 0px !important;
  left: 0vh !important;
}
#monitor-photo3 {
width: 30vh;
  height: 30vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo3.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 3px 0px black;
  top: -2px;
  left: 49vh;
  z-index: 2;
}
.open-circle8 {
  background-size: contain !important;
  z-index:5 !important;
  border-radius: 20px !important;
  width: 70vw !important;
  height: 90vh !important;
  overflow: hidden;
  display: block;
  border: 2px solid #161514 !important;
  box-shadow: 0px -10px 40px 0px #000, 0px 0px 100px 50px #161514 inset, 0px 0px 50px 0px #161514 inset !important;
  top: -5vh !important;
  left:0% !important;
}
#monitor-photo4 {
width: 19vh;
  height: 19vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo4.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  top: 31.5vh;
  left: 49vh;
  z-index: 2;
}
#monitor-photo5 {
width: 29vh;
  height: 29vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo5.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 3px 0px black;
  bottom: -2px;
  left: 39vh;
  z-index: 1;
}
#monitor-photo6 {
width: 21vh;
  height: 49.7vh;
  margin: 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo6.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 3px 0px black;
  bottom: -2px;
  left: 122vh;
  z-index: 2;
}
#monitor-photo7 {
width: 51vh;
  height: 20vh;
  margin: 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo7.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 3px 0px black;
  bottom: -2px;
  left: 146vh;
  z-index: 2;
}
#monitor-photo8 {
width: 24vh;
  height: 20vh;
  margin: 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo8.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 3px 0px black;
  bottom: -2px;
  right: 3vh;
  z-index: 2;
}
#monitor-photo9 {
width: 49vh;
  height: 49.7vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo9.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 3px 0px black;
  top: 31.5vh;
  left: 70.5vh;
  z-index: 1;
}
#monitor-photo10 {
width: 61vh;
  height: 30vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo10.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
top: -2px;
  left: 82vh;
  z-index: 1;
}
#monitor-photo11 {
width: 51vh;
  height: 58.5vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo11.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  top: -2px;
  right: 3vh;
  z-index: 1;
}

/* ----section bg 6 ------*/

#monitor-photo12 {
width: 35vh;
  height: 34.5vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo12.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  top: -2px;
  left: 0vh;
  z-index: 1;
}
#monitor-photo13 {
width: 51vh;
  height: 44vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo13.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  bottom: -2px;
  left: 0vh;
  z-index: 1;
}
#monitor-photo14 {
width: 76vh;
  height: 34.5vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo14.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  top: -2px;
  left: 38vh;
  z-index: 1;
}
#monitor-photo15 {
width: 21vh;
  height: 21vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo15.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
bottom: 23vh;
  left: 54vh;
  z-index: 1;
}
#monitor-photo16 {
width: 21vh;
  height: 21vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo16.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  bottom: -2px;
  left: 54vh;
  z-index: 1;
}
#monitor-photo18 {
width: 36vh;
  height: 44vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo18.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  bottom: -2px;
  left: 78vh;
  z-index: 1;
}
#monitor-photo19 {
width: 36vh;
  height: 22.5vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo19.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  bottom: -2px;
right: 44.5vh;
  z-index: 1;
}
#monitor-photo20 {
width: 36vh;
  height: 22.5vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo20.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  top: -2px;
right: 44.5vh;
  z-index: 1;
}

#monitor-photo21 {
width: 36vh;
  height: 30.5vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo21.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  top: 25vh;
right: 44.5vh;
  z-index: 1;
}
#monitor-photo22 {
width: 41vh;
  height: 56vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo22.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  bottom: -2px;
right: 0vh;
  z-index: 1;
}
#monitor-photo23 {
width: 41vh;
  height: 22.5vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo23.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  top: -2px;
right: 0vh;
  z-index: 1;
}

/* ----section bg 7 ------*/

#monitor-photo24 {
width: 35vh;
  height: 34.5vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo24.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  top: -2px;
  left: 0vh;
  z-index: 1;
}

#monitor-photo25 {
width: 51vh;
  height: 44vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo25.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  bottom: -2px;
  left: 0vh;
  z-index: 1;
}
#monitor-photo26 {
width: 76vh;
  height: 34.5vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo26.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  top: -2px;
  left: 38vh;
  z-index: 1;
}
#monitor-photo27 {
width: 21vh;
  height: 21vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo27.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
bottom: 23vh;
  left: 54vh;
  z-index: 1;
}
#monitor-photo28 {
width: 21vh;
  height: 21vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo28.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  bottom: -2px;
  left: 54vh;
  z-index: 1;
}
#monitor-photo29 {
width: 36vh;
  height: 44vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo29.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  bottom: -2px;
  left: 78vh;
  z-index: 1;
}
#monitor-photo30 {
width: 36vh;
  height: 22.5vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo30.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  bottom: -2px;
  right: 42vh;
  z-index: 1;
}
#monitor-photo31 {
width: 78vh;
  height: 55.5vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo31.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  top: -2px;
right: 0vh;
  z-index: 1;
}
#monitor-photo32 {
width: 36vh;
  height: 22.5vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo32.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  bottom: -2px;
  right: 0vh;
  z-index: 1;
}
#monitor-photo33 {
width: 41vh;
  height: 56vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo33.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  bottom: -2px;
right: 0vh;
  z-index: 1;
}
#monitor-photo34 {
width: 41vh;
  height: 22.5vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo34.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  top: -2px;
right: 0vh;
  z-index: 1;
}

/* ----section bg 8 ------*/

#monitor-photo35 {
width: 34vh;
  height: 31vh;
top: -2px;
  left: 0vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo35.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo36 {
width: 34vh;
  height: 47vh;
bottom: -2px;
  left: 0vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo36.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo37 {
width: 46vh;
  height: 52vh;
  top: -2px;
  left: 37vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo37.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo38 {
width: 27vh;
  height: 27vh;
  left: 85vh;
  bottom: 30vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo38.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo39 {
width: 27vh;
  height: 27vh;
  left: 115vh;
  bottom: 30vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo39.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo40 {
width: 46vh;
  height: 27vh;
  bottom: -2px;
  left: 37vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo40.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo41 {
width: 27vh;
  height: 27vh;
  bottom: -2px;
  right: 87vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo41.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo42 {
width: 27vh;
  height: 27vh;
  bottom: -2px;
  right: 57vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo42.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo43 {
width: 54vh;
  height: 27vh;
  bottom: -2px;
  right: 0vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo43.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo44 {
width: 55vh;
  height: 52vh;
top: -2px;
right: 0vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo44.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo45 {
width: 57vh;
  height: 21vh;
  left: 85vh;
  top: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo45.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo46 {
width: 57vh;
  height: 31vh;
  left: 3vh;
  top: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo46.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo47 {
width: 21vh;
  height: 21vh;
  left: 3vh;
  top: 34vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo47.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo48 {
width: 58vh;
  height: 47vh;
  left: 28vh;
  bottom: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo48.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo49 {
width: 21vh;
  height: 21vh;
  left: 3vh;
  bottom: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo49.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo50 {
width: 21vh;
  height: 21vh;
  left: 90vh;
  bottom: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo50.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo51 {
width: 38vh;
  height: 56vh;
  left: 90vh;
  top: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo51.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo52 {
width: 20vh;
  height: 31vh;
  left: 65vh;
  top: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo52.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo53 {
width: 38vh;
  height: 21vh;
  right: 46vh;
  bottom: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo53.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo54 {
width: 60vh;
  height: 43vh;
  right: 7vh;
  top: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo54.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo55{
width: 41vh;
  height: 35vh;
  right: 1vh;
  bottom: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo55.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}

/* ----section bg 11 ------*/

#monitor-photo56 {
width: 39vh;
  height: 39vh;
  left: 0vh;
  bottom: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo56.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}

#monitor-photo57 {
width: 39vh;
  height: 39vh;
  left: 0vh;
  top: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo57.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}


#monitor-photo58 {
width: 39vh;
  height: 39vh;
  left: 42vh;
  top: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo58.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo59 {
width: 39vh;
  height: 39vh;
  left: 42vh;
  bottom: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo59.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo60 {
width: 39vh;
  height: 39vh;
  left: 84vh;
  bottom: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo60.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}

#monitor-photo61 {
width: 39vh;
  height: 39vh;
  left: 84vh;
  top: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo61.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo62 {
width: 74vh;
  height: 39vh;
  right: 0vh;
  top: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo62.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo63 {
width: 74vh;
  height: 39vh;
  right: 0vh;
  bottom: -2px;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo63.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}

/* ----section bg 12 ------*/

#monitor-photo64 {
width: 41vh;
  height: 56vh;
  bottom: -2px;
  left: 0vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo64.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo65 {
width: 41vh;
  height: 22.5vh;
  top: -2px;
  left: 0vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo65.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo66 {
width: 41vh;
  height: 42.5vh;
  top: -2px;
  left: 43vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo66.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}

#monitor-photo67 {
width: 41vh;
  height: 35.5vh;
  bottom: -2px;
  left: 43vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo67.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}

#monitor-photo68 {
width: 41vh;
height: 50.5vh;
  bottom: -2px;
  left: 86vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo68.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo69 {
width: 41vh;
height: 28.5vh;
  top: -2px;
  left: 86vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo69.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}


#monitor-photo70 {
width: 41vh;
height: 28.5vh;
  top: -2px;
  left: 86vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo70.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}

#monitor-photo71 {
width: 53vh;
  height: 52.5vh;
  top: -2px;
  right: 16vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo71.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}
#monitor-photo72 {
width: 53vh;
  height: 25vh;
  bottom: -2px;
  right: 16vh;
  margin: 0 0;
  position: absolute;
  border: 2px solid #161514;
  float: left;
  background: #161514 url(../images/sections/photo72.jpg) no-repeat;
  background-size: 90%;
  background-position: center center;
  transition: 200ms ease;
  border-radius: 0vh;
  box-shadow: 0px 0px 5px 0px black;
  z-index: 1;
}












#monitor-photo1:hover, #monitor-photo2:hover, #monitor-photo3:hover, #monitor-photo4:hover,
#monitor-photo5:hover, #monitor-photo6:hover, #monitor-photo7:hover, #monitor-photo8:hover,
#monitor-photo9:hover, #monitor-photo10:hover, #monitor-photo11:hover, #monitor-photo12:hover,
#monitor-photo13:hover, #monitor-photo14:hover, #monitor-photo15:hover, #monitor-photo16:hover,
#monitor-photo18:hover, #monitor-photo19:hover, #monitor-photo20:hover, #monitor-photo21:hover,
#monitor-photo22:hover, #monitor-photo23:hover, #monitor-photo24:hover, #monitor-photo25:hover,
#monitor-photo26:hover, #monitor-photo27:hover, #monitor-photo28:hover, #monitor-photo29:hover,
#monitor-photo30:hover, #monitor-photo31:hover, #monitor-photo32:hover, #monitor-photo33:hover,
#monitor-photo34:hover, #monitor-photo35:hover, #monitor-photo36:hover, #monitor-photo37:hover,
#monitor-photo38:hover, #monitor-photo39:hover, #monitor-photo40:hover, #monitor-photo41:hover,
#monitor-photo42:hover, #monitor-photo43:hover, #monitor-photo44:hover, #monitor-photo45:hover,
#monitor-photo46:hover, #monitor-photo47:hover, #monitor-photo48:hover, #monitor-photo46:hover,
#monitor-photo47:hover, #monitor-photo48:hover, #monitor-photo49:hover, #monitor-photo50:hover,
#monitor-photo51:hover, #monitor-photo52:hover, #monitor-photo53:hover, #monitor-photo54:hover,
#monitor-photo55:hover, #monitor-photo56:hover, #monitor-photo57:hover, #monitor-photo58:hover,
#monitor-photo59:hover, #monitor-photo60:hover,#monitor-photo61:hover, #monitor-photo62:hover,
#monitor-photo63:hover, #monitor-photo64:hover,#monitor-photo65:hover, #monitor-photo66:hover,
#monitor-photo67:hover, #monitor-photo68:hover, #monitor-photo69:hover,
#monitor-photo70:hover, #monitor-photo71:hover {
  box-shadow: 0px 0px 16px -4px #000;
  border: 2px solid #161514;
  border-radius: 0vh;
  padding: 10px 10px;
}

#monitor-photo1, #monitor-photo2, #monitor-photo3, #monitor-photo4,
#monitor-photo5, #monitor-photo6, #monitor-photo7, #monitor-photo8,
#monitor-photo9, #monitor-photo10, #monitor-photo11, #monitor-photo12,
#monitor-photo13, #monitor-photo14, #monitor-photo15, #monitor-photo16,
#monitor-photo18, #monitor-photo19, #monitor-photo20, #monitor-photo21,
#monitor-photo22, #monitor-photo23, #monitor-photo24, #monitor-photo25,
#monitor-photo26, #monitor-photo27, #monitor-photo28, #monitor-photo29,
#monitor-photo30, #monitor-photo31, #monitor-photo32, #monitor-photo33,
#monitor-photo34, #monitor-photo35, #monitor-photo36, #monitor-photo37,
#monitor-photo38, #monitor-photo39, #monitor-photo40, #monitor-photo41,
#monitor-photo42, #monitor-photo43, #monitor-photo44, #monitor-photo45,
#monitor-photo46, #monitor-photo47, #monitor-photo48, #monitor-photo46,
#monitor-photo47, #monitor-photo48, #monitor-photo46, #monitor-photo47,
#monitor-photo48, #monitor-photo49, #monitor-photo50, #monitor-photo51,
#monitor-photo52, #monitor-photo53, #monitor-photo54, #monitor-photo55,
#monitor-photo56, #monitor-photo57, #monitor-photo58, #monitor-photo59,
#monitor-photo60, #monitor-photo61, #monitor-photo62, #monitor-photo63,
#monitor-photo64, #monitor-photo65, #monitor-photo66, #monitor-photo67,
#monitor-photo68, #monitor-photo69, #monitor-photo70, #monitor-photo71
{
padding: 10px 10px;
}


















.lite1{color:#a90000;font-size:60px;letter-spacing:-3px;transition:2s;
padding:20px 20px 20px 20px;}
.lite2{color:#acf016;font-size:42px;transition:2s;}
.lite3{color:#166bf0;font-size:135px;letter-spacing:-20px;transition:4s;
padding:20px 20px 20px 20px;letter-spacing:1px;}
.lite4{color:#f0c416;font-size:35px;transition:2s;}
.lite4:hover,.lite3:hover,.lite2:hover,.lite1:hover{color:#fff;
letter-spacing:1px;cursor:pointer;
}
.indice1{
color: white;
font-size: 35px;
letter-spacing: -3px;
transition: 2s;
padding: 0px 20px 10px 20px;
margin: 0px 0px;
line-height: 1;

}
.spacer100{width:100%;height:100px;}
.slideinfall {animation-name:slideInFall;animation-duration:4s;
transition:4s;padding: 0px 20px 20px 0px;
width:100%;border:0px solid #000;margin:10px auto;
height:100%;overflow-x:hidden;
}
@keyframes slideInFall {
from{
transform:translate3d(0,-100%,0);
visibility:visible;
}
to{
transform:translate3d(0,0,0);
}
}



/* -------------PARTNERS-----------------------------------------*/

.project-box{
width:95%;
float:left;
left: 5%;
position: relative;
margin: 0px 0px 0px 0px;
background:#161514;
transition: 2s ease-in-out;
color: #f26008;
text-align: left;
overflow:hidden;
}


#proj1 {

width:100%;
float:left;
margin: 0px 0px 0px 0px;
background:#161514 url(../images/partners/project1.jpg);
background-repeat:no-repeat;
background-size: 100px;
background-position: top left;
transition: 2s ease-in-out;
overflow:hidden;
}

#proj2 {
width:100%;
float:left;
margin: 0px 0px 0px 0px;
background:#161514 url(../images/partners/project2.jpg);
background-repeat:no-repeat;
background-size: 100px;
background-position: top left;
transition: 2s ease-in-out;
overflow:hidden;
}

#proj3 {
width:100%;
float:left;
margin: 0px 0px 0px 0px;
background:#161514 url(../images/partners/project3.jpg);
background-repeat:no-repeat;
background-size: 100px;
background-position: top left;
transition: 2s ease-in-out;
overflow:hidden;
}

#proj4 {
width:100%;
float:left;
margin: 0px 0px 0px 0px;
background:#161514 url(../images/partners/project4.jpg);
background-repeat:no-repeat;
background-size: 100px;
background-position: top left;
transition: 2s ease-in-out;
overflow:hidden;
}
#proj5 {
width:100%;
float:left;
margin: 0px 0px 0px 0px;
background:#161514 url(../images/partners/project5.jpg);
background-repeat:no-repeat;
background-size: 100px;
background-position: top left;
transition: 2s ease-in-out;
overflow:hidden;
}

#proj6 {
width:100%;
float:left;
margin: 0px 0px 0px 0px;
background:#161514 url(../images/partners/project6.jpg);
background-repeat:no-repeat;
background-size: 100px;
background-position: top left;
transition: 2s ease-in-out;
overflow:hidden;
}

#proj7 {
width:100%;
float:left;
margin: 0px 0px 0px 0px;
background:#161514 url(../images/partners/project7.jpg);
background-repeat:no-repeat;
background-size: 100px;
background-position: top left;
transition: 2s ease-in-out;
overflow:hidden;
}


#imgproj1{
background: #161514 url(../images/partners/1.jpg);

background-repeat: no-repeat;
background-size: 95%;
background-position: top left;
transition: 2s ease-in-out;
height: 0px;
width: 100%;
overflow: hidden;
margin: 120px 0px 0px 0px;
position: relative;
}

#proj1:hover,
#proj2:hover,
#proj3:hover,
#proj4:hover,
#proj5:hover,
#proj6:hover,
#proj7:hover {
height:650px;
}

#proj1:hover #imgproj1,
#proj2:hover #imgproj2,
#proj3:hover #imgproj3,
#proj4:hover #imgproj4,
#proj5:hover #imgproj5,
#proj6:hover #imgproj6,
#proj7:hover #imgproj7 {
height:380px;
}

.uptext  {
position: relative;
left: 0;
font-size: 10px;
text-align: left;
width: auto;
display: block;
line-height: 14px;
letter-spacing: 0px;
min-height: 50px;
padding: 10px 10px;
z-index: 3;
text-shadow: 0px 0px 2px #000;
}

.uptext2  {
position: relative;
left: 0;
font-size: 20px;
text-transform: full-size-kana;
width: auto;
display: block;
line-height: 25px;
letter-spacing: 0px;
font-weight: bold;
color: #c1bcbc;
top: 0;
z-index: 3;
padding: 10px 10px 10px 10px;
text-align: left;
}





/* ------------graphic img -----------------------------------------*/





#graphic_img1 {
width: 56vw;
height: 42vw;
float: left;
margin: 2vw 2vw 2vw 0vw;
background: #161514 url(../images/graphic/graphic1.jpg);
background-repeat: no-repeat;
background-size: 100%;
background-position: center center;
transition: 700ms ease-in-out;
overflow: hidden;
border: 2px solid #f26008;
border-radius: 0px 2000px 20px 0px;
box-shadow: 0px 0px 5px #000 inset, 0px 0px 90px #000 inset, 0px 0px 10px #000 inset, 0px 0px 10px #f7af05 inset;
position: relative;
clear: both;
}

#graphic_img1shape {
width: 59vw;
height: 46vw;
float: left;
margin: 2vw 2vw 0vw 0vw;
background: #161514;
transition: 700ms ease-in-out;
overflow: hidden;
border: 2px solid #f26008;
border-radius: 0px 2000px 0px 0px;
z-index: 9;
position: relative;
border-left: none;
clear: both;
border-bottom:none

}



#graphic_img2 {
width: 56vw;
height: 42vw;
float: left;
margin: 2vw 2vw 2vw 0vw;
background: #161514f0 url(../images/graphic/graphic7.jpg);
background-repeat: no-repeat;
background-size: 100%;
background-position: center center;
transition: 700ms ease-in-out;
overflow: hidden;
border: 2px solid #f26008;
border-radius: 0px 20px 2000px 0px;
position: relative;
}

#graphic_img2shape {
width: 59vw;
height: 46vw;
float: left;
margin: 2vw 2vw 0vw 0vw;
background: #161514f0;
background-repeat: no-repeat;
background-size: 100%;
background-position: center center;
transition: 700ms ease-in-out;
overflow: hidden;
border: 2px solid #f26008;
border-radius: 0px 20px 2000px 0px;
position: relative;
}






#graphic_img3 {
width: 500px;
height: 402px;
float: left;
margin: 0px 0px 0px 0px;
background: #161514 url(../images/graphic/weentext.gif);
background-repeat: no-repeat;
background-size: 100%;
background-position: right center;
transition: 700ms ease-in-out;
overflow: hidden;
border: 2px solid #f26008;
border-radius: 0px 5px 0px 0px;
position: absolute;
top: 0px;

}



#graphic_img3shape {
width: 500px;
height: 402px;
float: left;
margin: 0px 0px 0px 0px;
background: #161514;
background-repeat: no-repeat;
background-size: 100%;
background-position: right center;
transition: 700ms ease-in-out;
overflow: hidden;
border: 2px solid #f26008;
border-radius: 0px 5px 0px 0px;
position: absolute;
top: 0px;

}
#graphic_img4 {
width: 884px;
height: 349px;
margin: 20px 0px 0px 0px;
background: #161514 url(../images/graphic/graphic4.jpg);
  background-position-x: 0%;
  background-position-y: 0%;
  background-repeat: repeat;
  background-size: auto;
background-repeat: no-repeat;
background-size: 100%;
background-position: center center;
transition: 700ms ease-in-out;
overflow: hidden;
border: 2px solid #f26008;
border-radius: 0px 20px 20px 2000px;
position: relative;
clear: both;
}

#graphic_img4shape {
width: 884px;
height: 383px;
float: left;
margin: 0px 0px 0px 0px;
background: #161514;
transition: 700ms ease-in-out;
overflow: hidden;
border: 2px solid #f26008;
  border-right-color: rgb(242, 96, 8);
  border-right-style: solid;
  border-right-width: 2px;
  border-bottom-color: rgb(242, 96, 8);
  border-bottom-style: solid;
  border-bottom-width: 2px;
  border-left-color: rgb(242, 96, 8);
  border-left-style: solid;
  border-left-width: 2px;
border-radius: px 0px 0px 5px;
position: relative;
top: -2px;
border-left: none;
border-right: none;
border-bottom: none;
}




#graphic_img6 {
width: 82%;
height: 30vh;
float: left;
margin: 20px 0px 0px 0px;
background: #161514 url(../images/graphic/graphic6.jpg);
background-repeat: no-repeat;
background-size: 100%;
background-position: center center;
transition: 700ms ease-in-out;
overflow: hidden;
border: 2px solid #f26008;
border-radius: 0px 20px 20px 0px;
position: absolute;
top:225vh;
left: 0px;
}
#graphic_img7 {
width: 81%;
height: 97vh;
margin: 20px 0px 0px 0px;
background: #161514f0 url(../images/graphic/graphic7.jpg);
background-repeat: no-repeat;
background-size: 100%;
background-position: center center;
transition: 700ms ease-in-out;
overflow: hidden;
border: 2px solid #f26008;
border-radius: 0px 20px 2000px 0px;
position: relative;

}

#graphic_img8 {
width: 41%;
height: 122vh;
float: right;
margin: 20px 0px 0px 0px;
background: #161514 url(../images/graphic/graphic8.jpg);
background-repeat: no-repeat;
background-size: 100%;
background-position: center center;
transition: 700ms ease-in-out;
overflow: hidden;
border: 2px solid #f26008;
border-radius: 20px 20px 20px 20px;
position: absolute;
top: 188vh;
left: 61%;
}
#graphic_img9 {
width: 200px;
height: 190vh;
float: right;
margin: 20px 0px 0px 0px;
background: #161514 url(../images/graphic/graphic9.jpg);
background-repeat: no-repeat;
background-size: 100%;
background-position: center center;
transition: 700ms ease-in-out;
overflow: hidden;
border: 2px solid #f26008;
border-radius: 20px 20px 20px 20px;
position: absolute;
top: 290vh;
left: 0px;
}






#graphic_img1:hover,#graphic_img2:hover,#graphic_img3:hover,#graphic_img4:hover{background-size:110%;}






/* -----------------FORME E FIGURE ------------------------------------------*/





/*-- BOX HELLO 1 -- */

.box-hello {
  width: 50vh;
  position: relative;
  background: transparent;
  min-height: 35vh;
  overflow: visible;
  margin: 0% 0% 0% 5%;
  padding: 0px 0px 0px 0px;
  z-index: 4;
  border-radius: 0px 0px 0px 0px;
  left: -3.5vh;
  font-size: 2vw;
  height: 100%;
}
.box-hello p {
  text-align: left;
  font-size: 3vw;
  font-family: sans;
  padding: 0% 0% 0% 5%;
  color: #f26008;
  font-weight: bold;
  line-height: 1;
  width: 100%;
  border-radius: 0px 0px 0px 0px;
  background: transparent;
  position: absolute;
  top: 12em;
  left: 3.5vh;
}

.hello-h-1 {
width: 0px;
  height: 9em;
  position: absolute;
  top: 4em;
  left: 1.9em;
  z-index: 2;
  transition: 2s;
  border-left: 1.5em solid #f26008;
  border-radius: 0%;
}
.box-hello:hover .hello-h-1 {
height: 7em;
top: 6em;
}
.hello-h-2 {
width: 7em;
  height: 7em;
  position: absolute;
  top: 9em;
  left: 1.9em;
  z-index: 3;
  transition: 2s;
  border: 1.5em solid #f26008;
border-radius: 50% 50% 0% 0%;
border-bottom: 0px;
background: transparent;
}
.box-hello:hover .hello-h-2 {
width:7.3em;
}
.hello-e-1 {
width: 6em;
  height: 5.4em;
  position: absolute;
  top: 10.7em;
  left: 8.5em;
z-index: 2;
transition: 2s;
border: 1.5em solid #f26008;
border-radius: 30% 0% 0% 50%;
border-right: 0px;
border-top: 0px;
background: transparent;
}
.box-hello:hover .hello-e-1 {
left: 10.6em;
width: 6em;
}
.hello-e-2 {
width: 4.2em;
  height: 4em;
  position: absolute;
  top: 10em;
  left: 8.7em;
z-index: 2;
transition: 2s;
border: 1.5em solid #f26008;
border-radius: 50% 50% 30% 20%;
}
.box-hello:hover .hello-e-2 {
left: 10.7em;
  height: 4em;
  height: 4.3em;
}
.hello-e-3 {
width: 2em;
  height: 0em;
  position: absolute;
  top: 12.5em;
  left: 7.7em;
  z-index: 2;
  transition: 1s;
  border-bottom: 1.5em solid #f26008;
  border-radius: 0% 0% 0% 0%;
}
.box-hello:hover .hello-e-3 {
left: 9em;
  top: 12.9em;
}
.hello-l-1 {
left: 13.1em;
  height: 10em;
  top: 6.1em;
  width: 3em;
  position: absolute;
  z-index: 2;
  transition: 1s;
  border-left: 1.5em solid #f26008;
  border-radius: 0px 0px 0px 9px;
  border-top: 0px;
  border-bottom: 1.5em solid #f26008;
}
.box-hello:hover .hello-l-1 {
left: 15.9em;
top: 6.1em;
}

.hello-l-2 {
left: 14.9em;
  height: 10em;
  top: 6.1em;
  width: 4em;
position: absolute;
z-index: 2;
transition: 500ms;
border-left: 1.5em solid #f26008;
border-radius: 0px 0px 0px 9px;
border-top: 0px;
border-bottom: 1.5em solid #f26008;
}
.box-hello:hover .hello-l-2 {
left: 18em;
  top: 7.1em;
  width: 3.4em;
}
.hello-o {
left: 16.6em;
  width: 11em;
  height: 11em;
  top: 6em;
position: absolute;
z-index: 2;
transition: 200ms 500ms;
background: transparent;
border-radius: 100% 100% 100% 100%;
border: 1.5em solid #f26008;
}
.box-hello:hover .hello-o {
left: 20.5em;
  width: 7em;
  height: 7em;
  top: 8.5em;
}



/*-- BOX HELLO 1 end -- */







/*-- ----------------------------------------------- */
/*-- ------------------BOX ROBOT ------------------- */
/*-- ----------------------------------------------- */


/*-- BOX ROBOT 1-- */

.box-robot {
  width: 300px;
  height: 48vh;
  position: absolute;
  background: transparent;
  overflow: hidden;
  margin: 0;
  padding: 0px 0px 0px 0px;
  z-index: 1;
  border: 0px solid #1e1e1e;
  border-radius: 0vh 1vh 1vh 0vh;
  font-size: 1vw;
  transition: 1s;
  top: 22vh;
  right: -12%;
}

@media only screen and (max-width: 250px) {
   .box-robot {
    width: auto;
    font-size: 2.2vw;
    right: 20px;
   }
}



/*-- BOX face 1-- */
.box-face {
width: 27em;
  height: 21em;
  position: relative;
  z-index: 9;
  transition: 2s;
  overflow: hidden;
  left: 10em;
  top: 2em;
}


.occhiosx {
width: 2.1em;
  height: 0.9em;
  position: absolute;
  top: 6.3em;
  left: 6em;
border: 2px solid #f26008;
border-radius: 0px 48px 0px 62px;
  background: #161514;
z-index: 2;
}


.box-robot:hover #pupillasx  {
width: 1.8em;
  height: 1.8em;
  top: 7.0em;
  left: 6.8em;
}
#iridesx {
width: 0.5em;
  height: 0.5em;
  position: absolute;
top: 7.7em;
  left: 6.6em;
  transition: 200ms ease;
  background: #161514;
  border-radius: 12em;
  border: 2px solid #f26008;
}
.box-robot:hover #iridesx {
top: 7.7em;
  left: 7.5em;
}


.occhiodx {
width: 3.0em;
  height: 0.9em;
  top: 6.3em;
  left: 11em;
  position: absolute;
transition: 600ms ease;
border: 2px solid #f26008;
border-radius: 30px 0px 30px 0px;
background: #161514;
  z-index: 3;
}
.box-robot:hover .occhiodx {
  left: 11.5em;
}
.box-robot:hover #pupilladx {
  left: 11.9em;
}
.box-robot:hover #iridedx {
top: 7.7em;
  left: 12.6em;
}
#pupillasx {
width: 1.8em;
  height: 1.8em;
  top: 7.0em;
  left: 6.5em;
  position: absolute;
  transition: 700ms ease;
  background: #161514;
  border: 2px solid #f26008;
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-bottom-color: rgb(242, 96, 8);
  border-radius: 100%;
}
#pupilladx {
width: 1.8em;
  height: 1.8em;
  top: 7.0em;
  left: 11.5em;
  position: absolute;
  transition: 700ms ease;
  border: 2px solid #f26008;
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-bottom-color: rgb(242, 96, 8);
  border-radius: 100%;
  background: #161514;

}
#iridedx {
width: 0.5em;
  height: 0.5em;
top: 7.7em;
  left: 11.5em;
  position: absolute;
  transition: 200ms ease;
  background: #161514;
  border-radius: 12em;
  border: 2px solid #f26008;
}

#orecchio {
width: 1.5em;
  height: 2em;
  position: absolute;
  top: 7.3em;
  left: 16.2em;
  z-index: 2;
  transition: 500ms;
  border: 2px solid #f26008;
    border-left-width: 2px;
    border-left-style: solid;
    border-left-color: rgb(242, 96, 8);
  border-radius: 12px 120px 120px 6px;
  border-left: none;
}
#naso{
width: 1.1em;
  height: 1.2em;
  position: absolute;
  top: 9.7em;
  left: 7.9em;
  transition: 600ms ease;
  border-left: 2px solid #f26008;
  border-radius: 150px 0px 0px 150px;
  border-bottom: 2px solid #f26008;
  border-top: 2px solid #f26008;
}
#naso2{
width: 0.4em;
  height: 1em;
  position: absolute;
  top: 8.9em;
  left: 8.9em;
  transition: 600ms ease;
  border-right: 2px solid #f26008;
  border-radius: 0px 0px 150px 0px;
  border-bottom: 2px solid #f26008;
}



#bocca {
width: 1.5em;
  height: 0em;
  position: absolute;
  top: 12.9em;
  left: 8em;
  transition: 600ms ease;
  border-right: 2px solid #f26008;
  border-radius: 30px 0px 0px 0px;
  border-bottom: 2px solid #f26008;
}
.box-robot:hover #bocca {
width: 2em;
  height: 0.5em;
  top: 12.2em;
  left: 9em;
  border-radius: 0em 0em 0.9em 0em;
}

/*-- BOX face end -- */




#cap-1 {
width: 13em;
  height: 8em;
  position: absolute;
  top: -2.1em;
  left: 11.5em;
  z-index: 4;
  transition: 500ms;
border-radius: 5em 5em 0em 0em;
  border-bottom: 2px solid #eb5d09;
  border-left: 2px solid red;
  border: 2px solid red;
  background: #161514;
}

#cap-2 {
width: 7em;
  height: 1em;
  position: absolute;
  top: 4.8em;
  left: 4.8em;
  z-index: 3;
  transition: 500ms;
  border-radius: 150px 0px 0px 0px;
  border-bottom: 2px solid #eb5d09;
  border-right: 2px solid red;
  border: 2px solid red;
  background: #161514;
}


#capelli1 {
width: 5em;
  height: 7.9em;
  position: absolute;
  top: 0.5em;
  left: 15.9em;
  z-index: 9;
  transition: 500ms;
  border-radius: 6em 0em 5em 0em;
  border: 2px solid #f26008;
  background: #161514;
  rotate: 16deg;
}

#capelli2 {
width: 7em;
  height: 11.9em;
  position: absolute;
  top: -1.5em;
  left: 19.9em;
  z-index: 9;
  transition: 500ms;
  border-radius: 6em 0em 6em 2em;
  border: 2px solid #f26008;
  background: #161514;
  rotate: 92deg;
}
#capelli3 {
width: 1em;
  height: 4.9em;
  position: absolute;
  top: 7.5em;
  left: 24.9em;
  z-index: 8;
  transition: 500ms;
  border-radius: 0em 0em 3em 0em;
  border: 2px solid #f26008;
  background: #161514;

}


.robot-head-2 {
width: 6em;
  height: 6.7em;
  position: absolute;
  top: 2.5em;
  left: 21em;
  z-index: 2;
  transition: 2s;
  border: 2px solid #f26008;
  border-radius: 0em 4em 0em 0em;
  border-left: none;
  border-bottom: none;
}

.robot-head-3 {
width: 8em;
  height: 13.9em;
  position: absolute;
  top: 2.5em;
  left: 16.9em;
  z-index: 2;
  transition: 500ms;
  border-radius: 6em 0em 5em 5em;
  border-bottom: 2px solid #f26008;
  border-left: 2px solid #f26008;
  border-top: 2px solid #f26008;
}


.robot-collo1 {
width: 3em;
  height: 6.8em;
  position: absolute;
  top: 11.4em;
  left: 26.9em;
  z-index: 2;
  transition: 500ms;
  border-left: 2px solid #eb5d09;
  border-radius: 0px 0px 0px 150px;
  border-bottom: 2px solid #eb5d09;
}
.robot-collo2 {
width: 1.5em;
height: 2em;
  position: absolute;
  top: 16.1em;
  left: 22.9em;
  z-index: 2;
  transition: 500ms;
  border-right: 2px solid #eb5d09;
  border-radius: 0em 2em 0em 0em;
  border-top: 2px solid #eb5d09;
}

.tshirt1 {
width: 2em;
  height: 3em;
  position: absolute;
  top: 20.4em;
  left: 21.3em;
  z-index: 2;
  transition: 500ms;
  border-left: 2px solid #eb5d09;
  border-radius: 0em 0em 0em 1em;
  border-bottom: 2px solid #eb5d09;
  z-index: 6;
  background: #161514;
}
.tshirt2 {
width: 15em;
  height: 15em;
  position: absolute;
  top: 26.3em;
  left: 19.6em;
  z-index: 3;
  transition: 500ms;
  background: #161514;
  border-left: 2px solid #eb5d09;
  border-radius: 0em 0em 0em 9em;
  border-bottom: 2px solid #eb5d09;
  rotate: 18deg;
}
.tshirt3 {
width: 3em;
  height: 3em;
  position: absolute;
  top: 21.5em;
  left: 22.3em;
  z-index: 3;
  transition: 500ms;
  background: #161514;
  border-left: 2px solid #eb5d09;
  border-radius: 0em 0em 0em 0em;
}
.tshirt4 {
width: 3.5em;
  height: 5.5em;
  position: absolute;
  top: 16em;
  left: 24.3em;
  z-index: 9;
  transition: 500ms;
  background: transparent;
  border-bottom: 2px solid #eb5d09;
  border-right: 2px solid #eb5d09;
  border-radius: 0em 0em 2em 0em;
  rotate: 57deg;
}

.arm1 {
width: 0em;
  height: 8em;
  position: absolute;
top: 22.1em;
  left: 20.6em;
  z-index: 2;
  transition: 500ms;
  border-radius: 0px 0px 0px 0px;
  border-right: 2px solid #eb5d09;
}


.arm2 {
width: 3em;
  height: 11em;
  position: absolute;
  top: 20.5em;
  left: 30.6em;
  z-index: 3;
  transition: 500ms;
  border-radius: 0px 0px 0px 0px;
  border: 2px solid #eb5d09;
background: #161514;
}

.arm3 {
width: 3em;
  height: 11em;
  position: absolute;
  top: 30.5em;
  left: 29.6em;
  z-index: 3;
  transition: 500ms;
  border-radius: 0px 0px 0px 0px;
  border: 2px solid #eb5d09;
  rotate: 11deg;

}

.arm4 {
width: 2.6em;
  height: 10em;
  position: absolute;
  top: 28.5em;
  left: 19.6em;
  z-index: 1;
  transition: 500ms 2s;
  border-radius: 0px 0px 0px 0px;
  border: 2px solid #eb5d09;
  rotate: 118deg;

}
.box-robot:hover .arm4 {
top: 29.5em;
  left: 20.6em;
  rotate: 0deg;
}


/*-- BOX VIVA -- */



.box-viva {
width: 23em;
  height: 24em;
left: 3em;
  top: 14em;
  position: absolute;
  z-index: 2;
  transition: 500ms 2s;
  border: 0px solid #f26008;
  background: transparent;
  border-radius: 20px;
}
.box-robot:hover .box-viva {
top: 31em;
  left: 7em;
  rotate: -92deg;
}

#vivafondo1 {
width: 23em;
  height: 16em;
  position: absolute;
  top: 36em;
  left: 10em;
  z-index: 9;
  transition: 2s;
  background: #161514;
}
#viva1 {
width: 2em;
  height: 1.1em;
  position: absolute;
  bottom: 9em;
  left: 9.2em;
  z-index: 2;
  transition: 2s;
  background: #161514;
  border-radius: 20px 50px 50px 20px;
  border-bottom: 2px solid #f20834;
  border-left: 2px solid #f20834;
  border-right: 2px solid #f20834;
  border-top: 2px solid #f20834;
}
#viva2 {
width: 3em;
  height: 1.1em;
  position: absolute;
  bottom: 7.8em;
  left: 9.8em;
  z-index: 3;
  transition: 2s;
  background: #161514;
  border-radius: 20px 50px 50px 20px;
  border-bottom: 2px solid #f20834;
  border-left: 2px solid #f20834;
  border-right: 2px solid #f20834;
  border-top: 2px solid #f20834;

}

#viva3 {
width: 1.2em;
  height: 2.5em;
  position: absolute;
  bottom: 9.9em;
  left: 13.1em;
  z-index: 3;
  transition: 2s;
  background: #161514;
  border-radius: 2em 1em 0em 0em;
  border-right: 2px solid #f20834;
  border-left: 2px solid #f20834;
  border-top: 2px solid #f20834;

}

#viva4 {
width: 2.7em;
  height: 1.1em;
  position: absolute;
  bottom: 7em;
  left: 9.8em;
  z-index: 2;
  transition: 2s;
  background: #161514;
  border-radius: 20px 50px 50px 20px;
  border-bottom: 2px solid #f20834;
  border-left: 2px solid #f20834;
  border-right: 2px solid #f20834;
  border-top: 2px solid #f20834;
}
#viva5 {
width: 2.0em;
  height: 0.9em;
  position: absolute;
  bottom: 6em;
  left: 9.6em;
  z-index: 2;
  transition: 2s;
  background: #161514;
  border-radius: 20px 50px 50px 20px;
  border-bottom: 2px solid #f20834;
  border-left: 2px solid #f20834;
  border-right: 2px solid #f20834;
  border-top: 2px solid #f20834;


}




#viva6 {
width: 2.1em;
  height: 2.5em;
  position: absolute;
  bottom: 9.2em;
  left: 13.6em;
  z-index: 1;
  transition: 2s;
  background: #161514;
  border-radius: 0em 1em 0em 0em;
  border-top: 2px solid #f20834;
  border-right: 2px solid #f20834;
  rotate: -8deg;
}
#viva7 {
width: 1em;
  height: 5em;
  position: absolute;
  bottom: 11em;
  left: 13.0em;
  z-index: 1;
  transition: 2s;
  background: transparent;
  border-radius: 0px 0px 0px 45px;
  border-bottom: 2px solid #f20834;
  border-left: 2px solid #f20834;
}
#viva8 {
width: 2em;
  height: 3em;
  position: absolute;
  bottom: 7em;
  left: 12.6em;
  z-index: 2;
  transition: 2s;
  background: #161514;
  border-radius: 2em 0em 2em 0em;
  border-top: 2px solid #f20834;
  border-left: 2px solid #f20834;
  rotate: -24deg;

}
#viva9 {
width: 4.3em;
  height: 4.3em;
  position: absolute;
  bottom: 5.7em;
  left: 10em;
  z-index: 1;
  transition: 2s;
  background: #161514;
  border-radius: 0em 0em 2em 0.5em;
  border-bottom: 2px solid #f20834;
  border-left: 2px solid #f20834;
  border-right: 2px solid #f20834;
  border-top: 2px solid red;
}






.spalla1 {
width: 5em;
  height: 5.3em;
  top: 18.2em;
  left: 29em;
  position: absolute;
  z-index: 9;
  transition: 900ms ease;
  border: 2px solid #f26008;
  background: #161514;
  border-radius: 2em 3em 0.5em 0.5em;
}
.box-robot:hover .spalla1 {
top: 16.5em;
}
.spalla2 {
width: 3.5em;
  height: 4.2em;
  top: 18.5em;
  left: 19.9em;
  position: absolute;
  z-index: 2;
  transition: 200ms;
  border-radius: 3em 0em 0em 0.5em;
  border-left: 2px solid #f26008;
  border-top: 2px solid #f26008;
  border-bottom: 2px solid #f26008;
  background: #161514;

}


/*-- BOX smart -- */

.box-smartphone {
width: 31em;
  height: 15em;
  position: absolute;
  top: 25.5em;
  z-index: 9;
  transition: 500ms 200ms;
  border: 2px solid #f26008;
  background: #161514;
  border-radius: 1em;
  left: 42em;
}
.box-robot:hover .box-smartphone {
top: 23em;
  animation: swing 700ms 2s linear 1;
  left: 5em;
}
#mano-1 {
width: 5em;
  height: 8em;
  position: relative;
  top: -3em;
  left: 1em;
z-index: 2;
transition: 2s;
border: 2px solid #f20834;
background: #161514;
border-radius: 40px 20px 50px 50px;
float: left;
}
#mano-2 {
width: 5.5em;
  height: 10em;
  position: relative;
  top: -4em;
  left: 0em;
z-index: 2;
transition: 2s;
border: 2px solid #f20834;
background: #161514;
border-radius: 40px 20px 50px 50px;
float: left;
}
#mano-3 {
width: 5.5em;
  height: 10em;
  position: relative;
  top: -4em;
  left: 0.3em;
z-index: 2;
transition: 2s;
border: 2px solid #f20834;
background: #161514;
border-radius: 20px 20px 50px 50px;
float: left;
}
#mano-4 {
width: 4.5em;
  height: 8em;
  position: relative;
  top: -4em;
  left: 1em;
z-index: 2;
transition: 2s;
border: 2px solid #f20834;
background: #161514;
border-radius: 20px 40px 50px 50px;
float: left;
}
#mano-5 {
width: 6em;
  height: 9em;
  position: absolute;
  bottom: -3em;
  left: 4em;
z-index: 2;
transition: 2s;
border: 2px solid #f20834;
background: #161514;
border-radius: 50px 50px 25px 20px;
rotate: 30deg;
}



/*-- ----------------------------------------------- */
/*-- ------------------BOX ROBOT END---------------- */
/*-- ----------------------------------------------- */
.rettangolo {
  width: 50%;
  height: 200px;
  background-color: #3498db;
  transition: width 0.3s ease;
}

/* Aggiungi una classe per modificare la larghezza */
.rettangolo.full-width {
  width: 100%;
}




/*-- BOX FIGURA 2 -- */
.box-figura2 {
  width:100%;
  position: absolute;
  background: transparent;
  min-height: 80vh;
  overflow: visible;
  padding: 60px 0px 60px 0px;
  margin: 0px 0px;
  z-index: 4;
  transition: 1.5s ease;
  font-size: 9px;
  left: 0;
  border: 0px solid red;
  top: 0;
}
#bg-circle14:hover .box-figura2 {
  width: 100%;
}

.box-figura2 h3  {
margin: 0px 0px 0px 0px;
color: #f26008;
padding: 0px 0px 0px 0px;
position: relative;
top: 58vw;
left: 14vw;
z-index: 9;
font-size: 15px;
line-height: 98%;
transition: 1s cubic-bezier(1,0,.49,.78);
width: 85vw;
word-wrap: break-word;
position: absolute;
text-align: left;
letter-spacing: -1px;
font-weight: bold;
text-transform: uppercase;
}

.box-figura2 p {
  width: 200px;
  text-align: left;
  font-size: 1em;
  line-height: 120%;
  color: #fff;
  padding: 20px 20px;
  margin: 0px auto;
  background: #161514;
  position: absolute;
  height: auto;
  top: 30vh;
  border-radius: 1vh;
  border: 2px solid #f26008;
  z-index: 9;
}




.figura2-1 {
  top: 5%;
  left: 5%;
  width: 90%;
  height: 90%;
  border-radius: 1vh;
  border: 0px solid #006880;
  margin: 0px auto;
  background: transparent;
  transition: 300ms;
}
#bg-circle14:hover  .figura2-1 {
  animation: flicker 3s linear infinite;
  border: 1px solid #006880;
  box-shadow: 0px 0px 7px -5px #fff;
  background: #182124;
}




.figura2-2-a {
  top: 50%;
  height: 12em;
  width: 12em;
  left: 50%;
  background: #f26008;
  text-align: right;
  padding: 0px 0px;
  box-shadow: 0px 0px 0px #000, 0px 0px 0px #f26009;
  border-radius: 100%;
  border: 2px solid #f26008;
  transition: 500ms;
  margin: 0px 0px;
  transform: translate(-50%,-50%);
}


#bg-circle14:hover  .figura2-2-a {
  top: 50%;
  height: 11em;
  width: 11em;
  left: 50%;

}




.figura2-2-b {
  top: 40%;
  width: 3em;
  left: 12%;
  height: 3em;
  background: #161514;
  text-align: right;
  padding: 0px 0px;
  box-shadow: 0px 0px 0px #000, 0px 0px 0px #f26009;
  border-radius: 100%;
  border: 0.5em solid #f26008;
  transition: 200ms;
  transform: translate(-50%,-50%);
  overflow: hidden;
  animation: occhiosx 5s cubic-bezier(1,.01,0,1.01) infinite alternate;

}

#bg-circle14:hover  .figura2-2-b {
  animation: occhiosx2 5s infinite alternate;
  top: 40%;
  width: 3em;
  left: 12%;
  height: 3em;

}

#pupilla-b {
  top: 0em;
  height: 1em;
  width: 1em;
  left: 0em;
  background: #f26008;
  text-align: right;
  padding: 0px 0px;
  box-shadow: 0px 0px 0px #000, 0px 0px 0px #f26009;
  border-radius: 100%;
  border: 0.5em solid #f26008;
  transition: 200ms;
  position: relative;
  animation: pupillasx 5s cubic-bezier(1,.01,0,1.01) infinite alternate;
}
#bg-circle14:hover  #pupilla-b {
  animation: none;
  top: 0.5em;
  left: 0.5em;
}






.figura2-2-c {
  top: 35%;
  width: 5em;
  height: 5em;
  right: -15%;
  background: #161514;
  text-align: right;
  padding: 0px 0px;
  box-shadow: 0px 0px 0px #000, 0px 0px 0px #f26009;
  border-radius: 100%;
  border: 0.5em solid #f26008;
  transition: 200ms;
  transform: translate(-50%,-50%);
  overflow: hidden;
  animation: occhiodx 5s cubic-bezier(1,.01,0,1.01) infinite alternate;
}
#bg-circle14:hover  .figura2-2-c {
  animation: occhiodx2 5s infinite alternate;
  border-top: 1em solid #f26008;

}

#pupilla-c {
  top: 0.9em;
  height: 1.5em;
  width: 1.5em;
  right: 0em;
  background: #f26008;
  text-align: right;
  padding: 0px 0px;
  box-shadow: 0px 0px 0px #000, 0px 0px 0px #f26009;
  border-radius: 100%;
  border: 0.5em solid #f26008;
  transition: 600ms;
  position: relative;
  animation: pupilladx 5s cubic-bezier(1,.01,0,1.01) infinite alternate;

}

#bg-circle14:hover  #pupilla-c {
  animation: none;
  top: 0.5em;
  right: -1.2em;
  height: 1.8em;
  width: 1.8em;
}






.figura2-4 {
  top: 77%;
  height: 2em;
  width: 1.8em;
  left: 41%;
  background: #161514;
  text-align: right;
  padding: 0px 0px;
  box-shadow: 0px 0px 0px #000, 0px 0px 0px #f26009;
  transition: 2s, top 2s, width 2s, height 1s;
  margin: 0px 0px;
  transform: translate(-50%,-50%);
  border: 1em solid #161514;
  border-top: none;
  border-left: none;
  border-radius: 0% 0% 100% 0%;
  animation: bocca 5s infinite alternate;
}

#bg-circle14:hover  .figura2-4 {
 animation: bocca2 500ms cubic-bezier(.08,.82,.17,1) infinite alternate;
}




.figura2-5 {
  top: 10vh;
  left: 10%;
  background: transparent;
  width: 80%;
  height: 60vh;
  border-radius: 1vh;
  z-index: 5;
  border: 0px solid #ffef00 !important;
  transform: translate(0%, 0%);
  overflow: visible;
}

#bg-circle14:hover  .figura2-5 {
height: 60vh;
}
.figura2-6 {
  top: 10vh;
  left: 10%;
  background: transparent;
  width: 80%;
  height: 60vh;
  border-radius: 1vh;
  z-index: 5;
  border: 0px solid #ffef00 !important;
  transform: translate(0%, 0%);
  overflow: visible;
}
#bg-circle14:hover  .figura2-6 {
height: 200px;
}
.figura2-7 {
top: 334px;
left: 0;
width: 100%;
height: 182px;
border-radius: 0px 0px 100px 0px;
background:#161514;
}
.box-figura2:hover .figura2-7 {
height: 190px;
}
.figura2-8 {
top: 334px;
left: 0;
width: 100%;
height: 182px;
border-radius: 0px 0px 100px 0px;
background:#f26008;
}
.box-figura2:hover .figura2-8 {

height: 185px;
}
.figura2-9 {
  bottom: 0;
  left: 0;
  width: 100%;
  border-radius: 0px 0px 100px 0px;
  background: #161514;
  height: 20vh;
}

.figura2-11 {
top: 104px;
left: 16px;
border: 1px solid #161514;
background: #161514;
width: 15px;
height: 15px;
}
.figura2-12 {
top: 123px;
left: -1px;
border: 1px solid #161514;
background: #161514;
width: 16px;
height: 20px;
}
.figura2-13 {
top: 96px;
left: 32px;
border: 1px solid #161514;
background: #161514;
width: 15px;
height: 15px;
}
.figura2-14 {
top: 112px;
left: 32px;
border: 1px solid #161514;
background: #161514;
width: 15px;
height: 15px;
}
.figura2-15{
top: 48px;
left: 32px;
border: 1px solid #161514;
background: #161514;
width: 15px;
height: 15px;
}
.figura2-16 {
top: 128px;
left: 32px;
border: 1px solid #161514;
background: #161514;
width: 15px;
height: 15px;
}
.figura2-17 {
top: 136px;
left: 16px;
border: 1px solid #161514;
background: #161514;
width: 15px;
height: 15px;
}
.figura2-18 {
top: 120px;
left: 16px;
border: 1px solid #161514;
background: #161514;
width: 15px;
height: 15px;
}
.figura2-19 {
top: 144px;
left: -1px;
border: 1px solid #161514;
background: #161514;
width: 16px;
height: 16px;
}
.figura2-20 {
top: 152px;
left: 16px;
border: 1px solid #161514;
background: #161514;
width: 15px;
height: 15px;
}

.figura2-21{
top: 144px;
left: 32px;
border: 1px solid #161514;
background: #161514;
width: 15px;
height: 15px;
}




.figura2-10 {
top: 0px;
right: 0px;
z-index: 2;
border: 10px solid #f26008;
background: #161514;
width: 72px !important;
height: 68px !important;
border-radius: 50px 0px 0px 50px;
position: relative;
float: right;
margin: 0px 0px 150px 0px;
}




.figura2-1, .figura2-2-a, .figura2-2-b, .figura2-2-c, .figura2-3, .figura2-4,
.figura2-5, .figura2-6, .figura2-7, .figura2-8, .figura2-9,
.figura2-11, .figura2-12, .figura2-13, .figura2-14,
.figura2-15, .figura2-16, .figura2-17, .figura2-18, .figura2-19, .figura2-20, .figura2-21  {
position: absolute;
box-sizing: border-box;
}









/*-- BOX FIGURA 2 end -- */





/* -----------------FORME E FIGURE end------------------------------------------*/



#welcome_back {
width: 118px;
  background: transparent;
  position: absolute;
  top: 0;
  z-index: 0;
  height: 328px;
  margin: 0px 0px 0px 0px;
  float: left;
  left: 0;
}

.welcome_back-btn {
width:auto;
height:100%;
margin:0px 0px 0px 0px;
padding: 0vh 4vh;
position:relative;
opacity:1;
border:none;
float:right;
right:0;
z-index:999;
}
.welcome_back-btn a {
		color: #f26008;
		position: relative;
		background: transparent;
		letter-spacing: -1px;
		line-height: 1;
		opacity: 1;
		text-align: right;
		padding: 0vh 0vh;
		font-size: 3vw;font-weight:bold;
transition:2s;
}
.welcome_back-btn a:hover{
color:#fff;
text-shadow: 1px 0px 4px #EEECE3F2, 2px 1px 3px #FFD5FF, 2px 0px 2px #5c556a, 2px 0px 55px, 5px 0px 100px, 20px 0px 200px #D42C2C,40px 0px 200px #D42CCA;
}
.liteback {

  letter-spacing: -1px;
  line-height: 1;
  text-align: right;
  padding: 0vh 2vh 0vh 0vh;
  font-size: 1vw;
  top: -1.5vh;
  position: relative;
}


/* ------------------------TOMMY 2--------------------------------------------*/
.logo1 {z-index:999;opacity:1;border:none;margin:0px 0px 0px 0px;
position:relative;width:auto;float:right;right:0;}

.logo2 {height:80px;width:10%;float:right;margin: 0px 0px 0px 0px;z-index:999;
        background:transparent url(../images/home/logo_webtest2.png)no-repeat right center;
		  background-size:contain;transition: 2s ease-in-out; }

.logo2:hover {width: 60%;background-position: left center;
}
.titolo {
	background: url(../images/home/fondotitolo.jpg);
	background-repeat:repeat;
	background-size:cover;
	width:100%;height:100%;
	padding:0px 0px 0px 0px;
	transition:1.5ms;
	width:auto;
	float:right;


}
.titolo h1 {
		color: #fd0000;
		position: relative;
		background: transparent;
		letter-spacing: -1px;
		line-height: 1;
		opacity: 1;
		text-align: right;
		padding: 2vh 4vh;
		font-size: 3vw;
}

.titolo h2 {
	background-color: #ff0029;
	font-size: 2em;
	letter-spacing: 14px;
	color: #fff;
	opacity: 0.4;
	padding: 50px 0px 50px 0px;
	text-align: center;
	margin:0px 0px 0px 0px;
}





/* --------------------------ORIZONTAL SCROLL--------------------------------------------*/
html,
body {
  margin: 0;
  font-family: sans-serif;
}

main {
  overflow-x: hidden;
  display: flex;
}

 .one, .two, .three {
 overflow-x: hidden;
  display: flex;
}

h1 {
  margin: 0;
  padding: 0;
}

section {
  min-width: 100%;
  min-height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
   -webkit-overflow-scrolling: touch;
    -ms-overflow-style: none;
    scrollbar-width: none;


}

section:nth-child(even) {
  background-color: teal;
  color: white;
}


.read-article{
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 999;
  color: #000;
  background: white;
  padding: 10px 20px;
  border-radius: 10px;
  font-family: arial;
  text-decoration: none;
  box-shadow: rgb(50 50 93 / 25%) 0 0 100px -20px, rgb(0 0 0 / 30%) 0 0 60px -15px;
}
.read-article:hover{
    background: #d5d5d5;
    box-shadow: rgb(50 50 93 / 25%) 0 0 100px -20px, rgb(0 0 0 / 30%) 0 0 60px 0px;
}
iframe[sandbox] .read-article{
  display: none;
}

/* ----------------------------ORIZONTAL SCROLL END------------------------------------------*/

.littlebook1 .vertical {
  writing-mode: tb-lr;
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
white-space: nowrap;
display: block;
bottom: 0;
width: 20px;
height: 20px;
position: absolute;
left: 50%;
text-align: right;
top: 0;
}





/*-- CAMPO ANIMATO1  -- */

.campo-box {width: 100%;border: 0px solid green;
background: #232323 url(../images/campozoom/sinistra.jpg)repeat-y;
background-size: auto;
background-size: 50%;
background-position: top left;
height: 30vh;top:0;
transition: 2s;box-shadow: 0px 0px 60px 0px #000;
z-index: 2;
position: relative;

}
.campo-box:hover {background-size: 60%;}

.campo-box h2 {font-size:2.5em;}
.campo-box h3 {font-size:11px;}


.campo-box h2 {
left: 50%;
width: 50%;
position: relative;
text-align: left;
color: #c6b7b7;
margin: 0px 0px 0px 0px;
padding: 5vh 5vh 0vh 5vh;
line-height: 1;
transition: 2s;
width: 50%;
}
.campo-box h3 {
left: 50%;
width: 50%;
position: relative;
text-align: left;
color: #c6b7b7;
margin: 0px 0px 0px 0px;
padding: 10vh 5vh 5vh 5vh;
line-height: 1;
transition: 2s;
width: 50%;
}
.campo-box:hover h2 {
  font-size: 2em;
  left: 60%;
  position: relative;
  background: transparent;
  color: #7b756a;
  animation: bouce 2s;
  transition: 2s;
  height:auto;width:40%;
}
.campo-box:hover h3 {
  font-size: 11px;
  left: 60%;
  position: relative;
  background: transparent;
  color: #232323;
  animation: bouce 2s;
  transition: 2s;
  height:auto;width:40%;

}
.campo-box:hover .campooverlaysx {
  opacity: 1;width:40%;left:60%;
}
/*-- CAMPO-ANIMATO1 END  -- */






/*-- CAMPO-BOX2  -- */


.campo-box2 {width: 100%;border: 0px solid red;
background: transparent url(../images/campozoom/campodestra.jpg)no-repeat;
background-size: auto;
background-size: 50%;
background-position: center right;
height: 30vw;
transition: 1s cubic-bezier(1,0,.49,.78);
border-radius: 8px;
box-shadow:  16px 16px 32px #5c0000,
             -16px -16px 32px #ff0000;
}
.campo-box2:hover {background-size: 60%;height:30vw;

}

.campooverlaydx {
	position: absolute;
	top: 20vw;
	right: 0;
	height: 9vw;
	width: 5%;
	opacity: 1;
	transition: 800ms cubic-bezier(1,0,.49,.78);
	background-color: #ff0029;

}
.campooverlaysx { position: absolute;
left: 50%;
height: 10vh;
width: 5%;
opacity: 1;
transition: 2s;
background-color: #dbd8d8;
bottom: 0;

}
.campo-box2:hover .campooverlaysx,.campo-box2:hover .campooverlaydx {
  opacity: 1;width:100%;
}

.campo-box2 h2 {font-size: 80px;left: 0;
position: absolute;
text-align: right;
color: red;
margin: 0px 0px 0px 0px;
padding: 20px 20px 0px 20px;
line-height: 1;
transition: 1s cubic-bezier(1,0,.49,.78);
width: 50%;}
.campo-box2 h3{font-size:30px;top:20vw;left: 0;
position: relative;
text-align: right;
color: #232323;
margin: 0px 0px 0px 0px;
padding: 20px 20px 20px 20px;
line-height: 1;
transition: 1s cubic-bezier(1,0,.49,.78);
width: 50%;
}
.campo-box2:hover h2 {
font-size:70px;
left: 0;
width: 100%;
background:transparent;
color: #232323;
height:auto;
width:40%;
}
.campo-box2:hover h3 {
font-size:20px;
left:0;
width:100%;
position:relative;
background:transparent;
color:#232323;
height:auto;
width:40%;
}

/*-- CAMPO-BOX2 END -- */



/*-- CAMPO-BOOK1  -- */


.campo-book {width: 100%;border: 0px solid red;
background: transparent url(../images/campozoom/campodestra.jpg)no-repeat;
background-size: auto;
background-size: 50% 100%;
background-position: center right;
height: 90vh;
transition: 1s cubic-bezier(1,0,.49,.78);
border-radius: 8px;
box-shadow:  16px 16px 32px #5c0000,
             -16px -16px 32px #ff0000;
}
.campo-book:hover {background-size: 60% 110%;height:90vh;

}

.bookoverlaydx {
	position: absolute;
	top: 70vh;
	right: 0;
	height: 9vw;
	width: 5%;
	opacity: 1;
	transition: 800ms cubic-bezier(1,0,.49,.78);
	background-color: #ff0029;

}
.bookoverlaysx {right: 50%;
height: 40vh;
width: 0%;
	position: absolute;
	opacity: 1;
	transition: 1s cubic-bezier(1,0,.49,.78);
	background-color: #f8d499;
}
.campo-book:hover .bookoverlaysx,.campo-book:hover .bookoverlaydx {
  opacity: 1;width:40%;right: 60%;
}

.campo-book h2 {font-size: 15em;
left: 0;
position: relative;
text-align: left;
text-shadow: 0px 0px 7px #000;
color: #b80000;
margin: 0px 0px 0px 0px;
padding: 50px 20px 0px 20px;
line-height: 75%;
transition: 1s cubic-bezier(1,0,.49,.78);
letter-spacing:-10px;
}
.campo-book h3{font-size:4em;
position: absolute;
text-align: right;
color: #232323;
margin: 0px 0px 0px 0px;
padding: 20px 20px 20px 20px;
line-height: 1;
transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
width: 50%;bottom:5vh;

}
.campo-book p {font-size: 2em;
position: relative;
text-align: right;
color: red;
margin: 0px 0px 0px 0px;
padding: 20px 20px 20px 40px;
line-height: 1;
transition: 1s cubic-bezier(1,0,.49,.78);
width: 50%;
letter-spacing: -2px;
}
.campo-book:hover p {font-size:2em;
left:0;
width:100%;
position:relative;
background:transparent;
color:#f8d499;
height:auto;
width:40%;
}



.campo-book:hover h2 {
font-size:8em;
left: 0;
width: 100%;
background:transparent;
height:auto;
width:40%;
text-shadow: 0px 0px 5px #000;
}
.campo-book:hover h3 {
animation: bounce 1s;
left:0;bottom:5vh;
width:100%;
background:transparent;
color:#232323;
height:auto;
width:40%;
}

/*-- CAMPO-BOOK1 END -- */


/*-- CAMPO DROP -- */
.campodrop { background:#232323;border-radius:8px 8px 0px 0px;color:#020e26;padding:20px;width:100%;height:50vh;overflow:hidden;
             transform:translate(0);transition:5s;}
.campodrop:hover {background:#0e5071;}
.campodrop::before {content: "";position:absolute;top:-75px;left:-80px;z-index: -1;background: linear-gradient( to right, #8a0303, #0b475500 );
width:300px;height:100%;transition: 5s;}
.campodrop:hover::before {transform: scale(3);border-radius: 0px 8px 8px 0px;box-shadow: 0px 0px 0px 0px;}
.campodrop h2{text-align:left;font-size:50px;color:red;margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;line-height:1;transition:1s;}




/*-- CAMPO DROP3 -- */
.campodrop3 { background:#232323;border-radius:8px 8px 0px 0px;color:#020e26;padding:20px;width:100%;height:50vh;overflow:hidden;
             transform:translate(0);transition:5s;}
.campodrop3:hover {background:#fff;}
.campodrop3::before {content:"";position:absolute;top:-75px;left:-45px;z-index:-1;background:linear-gradient( to right, #3bd9d9, #36a6bf );
                   border-radius:50%;width:300px;height:300px;transition:5s; }
.campodrop3:hover::before {transform: scale(3);border-radius: 0px 8px 8px 0px;box-shadow: 0px 0px 40px 0px;}
.campodrop3 h2{text-align:left;font-size:50px;color:red;margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;line-height:1;transition:1s;}





#sezionelibri {position:relative;padding:100px 0px 0px 0px;}



/*-- CAMPO-BOOK2  -- */


.campo-book2 {width: 100%;border: 0px solid red;
background: #072b51 url(../images/campozoom/book1.jpg)no-repeat;
background-size: 120% 120%;
background-position: center left;
height: 90vh;
transition: 1s cubic-bezier(1,0,.49,.78);
border-radius: 8px;
box-shadow:  16px 16px 32px #5c0000,
             -16px -16px 32px #ff0000;
}
.campo-book2:hover {background-size: 100% 100%;height:90vh;

}

.book2overlaydx {
	position: absolute;
bottom: 40vh;
left: 0;
height: 60vh;
width: 50%;
opacity: 1;
transition: 800ms cubic-bezier(1,0,.49,.78);
background-color: #ff0029;

}
.book2overlaysx {
	position: absolute;
	top: 70vh;
	left: 0;
	height: 10vw;
	width: 5%;
	opacity: 1;
	transition: 1s cubic-bezier(1,0,.49,.78);
	background-color: #ff0029;
}
.campo-book2:hover .book2overlaysx,.campo-book2:hover .book2overlaydx {
 opacity: 1;
height: 60vh;
border-radius: 0px;
bottom: 0;
}

.campo-book2 h2 {font-size: 4em;font-family:modernaregular;
left: 0;
position: absolute;
text-align: left;
color: red;
margin: 0px 0px 0px 0px;
padding: 20px 20px 0px 30px;
line-height: 85%;
transition: 1s cubic-bezier(1,0,.49,.78);
width: 100%;
overflow: hidden;z-index:5;}
.campo-book2 h3{font-size: 9em;
right: 0;
position: relative;
text-align: right;
color: #232323;
margin: 0px 0px 0px 0px;
padding: 20px 20px 20px 20px;
line-height: 1;
transition: 1s 300ms cubic-bezier(1,0,.49,.78);
width: 100%;
top: 0;
}
.campo-book2:hover h2 {
font-size: 3.8em;
left: 0;
background: transparent;
color: red;
height: auto;
animation: 1s swing;

}
.campo-book2:hover h3 {
font-size:9em;
left:0;
position:relative;
background:transparent;
color:#232323;
height:auto;
}

/*-- CAMPO-BOOK2 END -- */

/*-- CAMPO-BOOK3  -- */


.campo-book3 {width: 100%;border: 0px solid red;
background: #072b51 url(../images/campozoom/book1.jpg)no-repeat;
background-size: auto;
background-size: 100% 100%;
background-position: center right;
height: 70vh;
transition: 1s cubic-bezier(1,0,.49,.78);
border-radius: 8px;
box-shadow:  16px 16px 32px #5c0000,
             -16px -16px 32px #ff0000;
}
.campo-book3:hover {background-size: 60% 100%;height:70vh;

}

.book3overlaydx {
	position: absolute;
bottom: 40vh;
left: 0;
height: 60vh;
width: 50%;
opacity: 1;
transition: 800ms cubic-bezier(1,0,.49,.78);
background-color: #ff0029;

}
.book3overlaysx {
	position: absolute;
	top: 70vh;
	left: 0;
	height: 10vw;
	width: 5%;
	opacity: 1;
	transition: 1s cubic-bezier(1,0,.49,.78);
	background-color: #ff0029;
}
.campo-book3:hover .book3overlaysx,.campo-book3:hover .book3overlaydx {
 opacity: 1;
height: 60vh;
border-radius: 0px;
bottom: 0;
}

.campo-book3 h2 {font-size: 4em;font-family:modernaregular;
left: 0;
position: absolute;
text-align: left;
color: red;
margin: 0px 0px 0px 0px;
padding: 20px 20px 0px 30px;
line-height: 85%;
transition: 1s cubic-bezier(1,0,.49,.78);
width: 100%;
overflow: hidden;z-index:5;}
.campo-book3 h3{font-size:9em;left:0;
position: relative;
text-align: right;
color: #232323;
margin: 0px 0px 0px 0px;
padding: 20px 20px 20px 20px;
line-height: 1;
transition: 1s 300ms cubic-bezier(1,0,.49,.78);
width: 50%;
}
.campo-book3:hover h2 {
font-size: 12em;
left: 0;
background: transparent;
color: red;
height: auto;
animation: 1s swing;

}
.campo-book3:hover h3 {
font-size:9em;
left:0;
position:relative;
background:transparent;
color:#232323;
height:auto;
width:40%;
}

/*-- CAMPO-BOOK3 END -- */


/*-- LITTLE-BOOKS1  -- */

.littlebook1 {width: 100%;
border: 0px solid red;
background: transparent;
  background-position-x: 0%;
  background-position-y: 0%;
  background-size: auto;
background-size: 50vh 50vh;
background-position: bottom left;
height: 50vh;
transition: 1s cubic-bezier(1,0,.49,.78);
overflow: visible;
box-shadow: 0px 0px 1px 0px #090808;
float: right;
border-radius: 0% 0% 0% 0%;
z-index: 3;
position: relative;
padding: 30px 0px;
}
.littlebook1:hover {background-position:bottom right;width: 100%;

}

.little1overlaydx {
	position: absolute;
	top: 70vh;
	right: 0;
	height: 9vw;
	width: 5%;
	opacity: 1;
	transition: 800ms cubic-bezier(1,0,.49,.78);
	background-color: #ff0029;

}


.little1overlaysx {position: absolute;
opacity: 1;
transition: 1s cubic-bezier(1,0,.49,.78);
height: 50vh;
display: block;z-index:4;width: 100%;
top: 0;
}
.little1overlaysx p { font-size: 1em;
text-align: left;
width: 180px;
position: relative;
background: transparent;
color: #0f0e0e;
padding: 5px 5px 5px 5px;
margin: 0px 0px 0px 0px;
transition: 600ms 200ms cubic-bezier(1,0,.49,.78);
line-height: 1;
height: auto;
z-index: 3;
bottom: 0;
top: 42vh;
border: 1px solid;
transform: rotate(-90deg);
right: 0;
float: right;}
.little1overlaysx:hover p {color:#665e5e;}







.littlebook1:hover .little1overlaysx {
background-color: transparent;
}
.littlebook1:hover .little1overlaydx {
  opacity: 1;width:40%;right: 60%;
}
.littlebook1 h2 {font-size: 12em;
left: 0;
position: absolute;
text-align: left;
text-shadow: 0px 0px 6px #000;
color: #232323;
margin: 0px 0px 0px 0px;
padding: 0px 50px 0px 50px;
line-height: 1;
transition: 1s cubic-bezier(1,0,.49,.78);
letter-spacing: -10px;
z-index: 2;
box-shadow: 0px 0px 1px 0px #000;
width: 100%;

}
.littlebook1 h3{font-size:4em;
position: absolute;
text-align: right;
color: #232323;
margin: 0px 0px 0px 0px;
padding: 20px 20px 20px 20px;
line-height: 1;
transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
width: 50%;bottom:5vh;

}
.littlebook1 p {font-size: 1em;
text-align: left;
width: 150px;
position: relative;
background: transparent;
color: #0f0e0e;
padding: 5px 5px 5px 5px;
margin: 0px;
transition: 3s 200ms cubic-bezier(1,0,.49,.78);
line-height: 1;
height: 150px;
z-index: 3;
bottom: 0;
top: 22vh;
left: -50px;
right: 0;
box-shadow: 0px 0px 1px 0px #000;border:none;
}



.littlebook1:hover p {
color: #9b9494;
border-radius: 100%;
left: 100%;
padding: 30px 0px 0px 30px;
top: 0;
width: 400px;
height: 400px;
}
.littlebook1:hover h2 {
font-size:14em;
left: 0;
width: 100%;
background:transparent;
height:auto;
text-shadow: 0px 0px 5px #423c3c;
}
.littlebook1:hover h3 {
animation: bounce 1s;
left:0;bottom:5vh;
width:100%;
background:transparent;
color:#232323;
height:auto;
width:40%;
}


/*-- LITTLE BOOKS1 END -- */



/*-- CAMPO DROP4 -- */
.campodrop4 {background: #232323b8;
mix-blend-mode: normal;
color: #020e26;
padding: 0px;
width: 40vh;
height: 40vh;
overflow: hidden;
transform: translate(0);
transition: 5s;
border: 0px solid #f44906;
border-radius: 100% 100% 100% 100%;border-left: 5px solid #171616;
position: absolute;
bottom: 50px;
left: 50px;
box-shadow: 0px 0px 50px 0px #000;
}
.campodrop4:hover {background: #232323b8;
width: 40vh;
padding: 0px 0px 0px 0px;
bottom: 80px;
left: 60px;}
.campodrop4::before {content: "";
position: absolute;
z-index: -1;
background: linear-gradient( to right, #8a030391, #d0bb0c54 );
width: 100%;
height: 100%;
transition: 2s;
box-shadow: 0px 0px 0px 0px #000;
border-radius: 100% 100% 100% 100%;
transform: scale(50%, 50%);
}
.campodrop4:hover::before {
transform: scale(110%, 110%);
width: 100%;}
.campodrop4 h2{text-align:left;font-size:50px;color:red;margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;line-height:1;transition:1s;}





/*-- LITTLE-BOOKS2  -- */

.littlebook2 {border: 0px solid #2d1b1b;
background: transparent url(../images/campozoom/littlebook_2.jpg)no-repeat;
background-size: auto;
background-size: 100% 100%;
background-position: center right;
height: 50vh;width:50vh;
transition: 1s cubic-bezier(1,0,.49,.78);
border-radius: 0% 100% 100% 100%;
overflow:visible;
text-shadow: 0px 0px 6px #000;box-shadow: 0px 0px 0px 0px #000;
border-left: 15px solid #1c1a1a;
}
.littlebook2:hover {background-size: 110% 110%;
}
.little2overlaydx {
position: relative;
width: 100%;
height: 10vh;
opacity: 1;
transition: 800ms cubic-bezier(1,0,.49,.78);
background-color: transparent;
z-index: 1;
}
.little2overlaysx {right: 50%;
height: 40vh;
width: 0%;
	position: absolute;
	opacity: 1;
	transition: 1s cubic-bezier(1,0,.49,.78);
	background-color: #f8d499;
}
.littlebook2:hover .little2overlaysx {
  opacity: 1;width:0%;right: 60%;height:0vh;
}






.littlebook2 h2 {font-size: 1em;
z-index: 2;
left: 0;
position: relative;
text-align: right;
text-shadow: 0px 0px 1px #000;
color: #b74646;
margin: 0px 0px 0px 0px;
padding: 50px 30px 0px 30px;
line-height: 95%;
transition: 1s cubic-bezier(1,0,.49,.78);
letter-spacing: 10px;
}
.littlebook2 h3{ font-size: 1em;
position: relative;
text-align: right;
color: #fff;
margin: 0px 0px 0px 0px;
padding: 5px 5px 5px 20px;
line-height: 1;
transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
width: 100%;
}
.littlebook2 p {font-size: 0.8em;
position: absolute;
background: transparent;
color: #a8a592;;
height: auto;
padding: 20px 20px 20px 40px;
transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
line-height: 110%;
top:60%;
}
.littlebook2 h4 {font-size: 1em;
left: 0;
width: 100%;
position: relative;
background: transparent;
color: red;
height: auto;
padding:20px 20px 20px 20px;
margin:40px 0px 0px 0px;
transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
}


.littlebook2:hover h4 {font-size: 1em;
left: 0;
position: relative;
background: #e80d0d;
color: #f8d499;
height: auto;
}
.littlebook2:hover p {
left: 0;
color: #329b56;
height: auto;
top: 55%;
}
.littlebook2:hover h2 {
color: #46b797;
padding: 10px 0px 0px 0px;
}
.littlebook2:hover h3 {height: auto;
animation: pulse 1s;
left: 0;
width: 10%;
}

/*-- LITTLE BOOKS2 END -- */







/*-- CAMPO DROP 5 -- */

.campodrop5 {background: #232323b8;position:absolute;
color: #020e26;
padding: 0px 0px;
width:100%;
height:60vh;
overflow: hidden;
transform: translate(0);
transition:5s;border-radius: 0px 8px 500px 0px;}
.campodrop5:hover {background:#232323b8;}
.campodrop5::before {content: "";
position: absolute;
top: 0;
right: 0;
z-index: -1;
background: linear-gradient( to right, #8a030391, #d4420085 );
width: 100%;
height: 100%;
transition: 5s;
border-radius: 0px 8px 500px 0px;
box-shadow: 0px 0px 10px 0px #000; }
.campodrop5:hover::before {transform: scale(2.5, 1.5);border-radius: 0px 8px 8px 0px;right: 50%;}
.campodrop5 h2{text-align:left;font-size:50px;color:red;margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;line-height:1;transition:1s;}

/*-- CAMPO DROP 5 end -- */





#sezione-book-sx{float:left;padding:0px 0px;height:auto;border:0px solid black;width:50%;overflow:hidden;}
#sezione-book-dx{right:50px;float:right;padding: 0px 0px;height: auto;border:2px solid black;width:50%;overflow:visible;position:relative;}

#sezione-book-sx-bottom{position:relative;float:left;padding:0px 0px;height:auto;border: 2px solid #2a2d2a;width:50%;overflow:visible;}
#sezione-book-dx-bottom{float:right;padding: 0px 0px;height: auto;border:0px solid black;width:50%;overflow:visible;position:relative;background:transparent;}



/*-- HOME ORIZZONTAL SECTIONS ------------- -- */


#sezione-sx-photo{
position:relative;
float:left;
padding:0px 0px;
height:80vh;
border:0px solid #2a2d2a;
overflow:visible;
}
#sezione-dx-photo {
float:right;
padding: 0px 0px;
height: auto;
border:0px solid black;
overflow:visible;
position:relative;
background:transparent;}



#photo1 {
background: transparent url(../images/sections/photo1.jpg);
  background-size: cover;
  background-position: center center;
}
.box-photo:hover #photo1 {background-size: 10% 10%;}

#photo2 {
background: transparent url(../images/sections/photo2.jpg);
  background-size: cover;
  background-position: center center;
}


#photo3 {
background: transparent url(../images/sections/photo3.jpg);
  background-size: cover;
  background-position: center center;
}

#photo4 {
background: transparent url(../images/sections/photo4.jpg);
  background-size: cover;
  background-position: center center;
}

.box-photo {
width: 100%;height:350px;
  background: #d21616;
  background-size: auto;
  background-size: 110% 110%;
  background-position: center center;
  transition: 1s cubic-bezier(1,0,.49,.78);
  border-radius: 8px;
  box-shadow: 0px 0px 2px 0px #000;
  overflow: visible;

}
.photo1:hover {background-size: 100% 100%;}

/*-- HOME ORIZZONTAL SECTIONS END ---------- -- */









.riga6 {
  width: 300px;
  min-height: 260px;
  left: 3vw;
  z-index: 3;
  transition: min-height 3s, width 1s 1s;
  border: 2px solid #f26008;
  border-top-color: rgb(242, 96, 8);
  border-top-style: solid;
  border-top-width: 2px;
  border-right-color: rgb(242, 96, 8);
  border-right-style: solid;
  border-right-width: 2px;
  border-radius: 0vh 0vh 0vh 4vh;
  border-right: 0px;
  border-top: 0px;
  z-index: 9;
  position: absolute;
  bottom: 0;
}
.frange1:hover .riga6 {
  min-height: 365px;
  width: 333px;
}







/*-- TOM 2 ---------- -- */


#quote-square {
width: auto;
  position: absolute;
  background-position: left top;
  min-height: 5vh;
  transition: 1s;
  box-shadow: 0px 0px 0px 0px #000 inset;
  margin: 0;
  padding: 1vh 1vh;
  bottom: 0vh;
  border-radius: 2vw;
  left: 0vh;
  z-index: 2;
}

.quote-iconsx {
  line-height: 83%;
  text-align: left;
  color: #161514;
  text-transform: uppercase;
  font-size: 7vw;
  position: absolute;
  margin: 0px auto;
  width: 100%;
  height: 5vh;
  padding: 0vh 0vh;
  top: 0vh;
  right: 0vh;
}
.quote-icondx {
  line-height: 83%;
  text-align: right;
  color: #161514;
  text-transform: uppercase;
  font-size: 7vw;
  position: absolute;
  margin: 0px auto;
  width: 100%;
  height: 5vh;
  padding: 0vh 0vh;
  top: 0vh;
  right: 0vh;
}
#quote-square p {
  font-size: 0.5vw;
  line-height: 100%;
  letter-spacing: 2px;
  margin: 0;
  padding: 1vh 7vh 0vh 9vh;
  color: #161514;
}








#img_home1 {
width: 95%;
position: relative;
background: #f26008 url(../images/campozoom/img_home1.jpg);
background-repeat: repeat-y;
background-attachment: scroll;
background-size: 5%;
background-position: left top;
min-height: 20vh;
transition: 1s;
overflow: visible;
box-shadow: 0px 0px 0px 0px #000 inset;
margin: 0;
padding: 0px 0px 0px 0px;
}
#main-square {
  width: 0%;
  height: 0px;
  position: absolute;
  top: 10vh;
  left: 3%;
  transition: 2s ease;
  background: transparent;
  border-left: 11px solid #f26008;
}



#main-square3 {
width: 33%;
height: 0px;
position: absolute;
bottom: 0px;
left: 40%;
transition: 4s ease;
background: transparent;
border: 2px solid #f26008;
border-bottom: 0px;
z-index: 3;
border-radius: 2000px 0px 0px 0px;
border-right: none;

}

.frange1:hover #main-square3 {
width: 59%;
left: 30%;
}

#main-square4 {
width: 93%;
position: relative;
background: transparent url(../images/campozoom/img_home2.jpg);
background-repeat: no-repeat;
background-attachment: scroll;
background-size: 100%;
background-position: 100% -160px;
height: 200px;
transition: 6s ease-in-out;
overflow: visible;
box-shadow: 0px 0px 0px 0px #0b0a0a inset;
margin: 0px 0px 0px 0px;
padding: 20px 0px 20px 0px;
left: 0vw;
top: 0vw;
}
#main-text1:hover #main-square4 {
background-position: 100% 0%;
}

#main-square5 {
width: 95%;
position: relative;
background: transparent url(../images/campozoom/main-square5.jpg);
background-repeat: repeat-y;
background-attachment: scroll;
background-size: auto;
background-position: 100% 100%;
height: 266px;
transition: 4s;
overflow: visible;
box-shadow: 0px 0px 0px 0px #000 inset;
margin: 0;
padding: 0px 0px 0px 0px;
left: 0vw;
top: 0;
}
#main-square5:hover {
background-position: 100% 0%;
}
#main-text1{
width: 95%;
min-height: 80vh;
position: relative;
background: transparent;
border-right: 2px solid #f26008;
border-top: 0px;
border-radius: 0px 0px 0px 0px;
border-left: 0px;
padding: 0px 0px 0px 0px;
top: 0;
margin: 0px 0px 0px 0px;
box-shadow: 0px 0px 0px 0px #000;
}

#img-hand {
  width: 100%;
  height: 24vh;
  background: transparent url(../images/campozoom/img_hand.jpg) no-repeat;
  background-size: contain;
  background-position: right center;
  top: 0;
  position: relative;
  margin: 0px 0px 0px 0px;
  z-index: 1;
}

#main-text1 p {
width: 80%;
float: right;
border-radius: 0px 0px 120px 20px;
left: 0;
top: 0;
border-top: 0px;
position: relative;
margin: 0;
z-index:3;
text-align:right;
font-size:54px;
font-family:tahoma;
padding: 1vh 1vh;
color:#f26008;
font-weight:bold;
line-height:1;
}
#main-text1 h1 {
text-align:right;font-size:3vw;font-family:sans;
padding:1vh 1vh;color:#f26008;font-weight:bold;
line-height:88%;word-break: break-word;
letter-spacing:-1px;width:100%;
}
#main-text1 h2 {
text-align: right;
font-size: 0.7vw;
  font-family: sans;
padding: 1vh 1vh;
  color: #f26008;
  font-weight: bold;
  line-height: 120%;
  word-break: break-word;
  letter-spacing: -1px;
  width: 56%;
  border-bottom: 0px solid #f26008;
  border-radius: 0px;
  margin: 0 0;
  height: 100%;
  float: right;
}
#main-text1 h3{
background: transparent;
  text-align: right;
  font-size: 1vw;
  font-family: sans;
  padding: 1vh 1vh;
  color: #f26008;
  font-weight: bold;
  line-height: 110%;
  word-break: break-word;
  letter-spacing: -1px;
  border: none;
  width: 80%;
  margin: 0px 0px 0px 0px;
  border-radius: 0px;
  float: right;
}

#main-text{
width: 85vw;
min-height: 37vh;
position: absolute;
transition: 8s ease;
background: #161514;
border: 10px solid red;
border-radius: 0px 15px 15px 0px;
border-left: 0px;
margin: 0;
top: 106%;
box-shadow: 0px 0px 20px 2px #000;
margin: 0px 0px 0px 0px;
}

#main-text2{
width: 95%;
min-height: 49vh;
position: relative;
transition: 8s ease;
background: #161514;
border-radius: 0px 0px 100px 0px;
top: 0vh;
margin: 0px 0px 0px 0px;
box-shadow: 0px 0px 0px 0px #000;
overflow: hidden;
border: 0vw solid #f26008;
  border-top-color: rgb(242, 96, 8);
  border-top-style: solid;
  border-top-width: 5vw;
  border-left-color: rgb(242, 96, 8);
  border-left-style: solid;
  border-left-width: 5vw;
border-left: 0px;
border-top: 0px;
}


#main-text2 p {
width: 80%;
float: right;
color: #736869;
text-align: left;
padding: 180px 15px 103px 5px;
font-size: 12px;
line-height: 1.2;
left: 0;
top: 0;
border-top: 0px;
position: relative;
margin: 0;
}
#main-text4 {
background: #161514;
border-radius: 0px 100px 0px 0px;
width: 95%;
height: auto;
margin: 0px 0px;
padding: 0px;
position: relative;
overflow: hidden;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
transition:2s;
}
#main-text4:hover {
width: 95%;
height: auto;
}
#main-text4 p {
width: 80%;
color: #736869;
text-align: left;
padding: 120px 15px 41px 5px;
font-size: 12px;
line-height: 1.2;
left: 0;
top: 0;
border-top: 0px;
position: relative;
margin: 0;
float: right;
}
#main-text3 {
  width: 55vw;
  height: 70vw;
  min-height: 87px;
  position: absolute;
  transition: 8s ease;
  background: #161514;
  border: 10px solid #f26008;
  border-radius: 0% 100% 100% 0%;
  border-left: 0px;
  bottom: -35vw;
  box-shadow: 0px 5px 20px 0px #000;
  margin: 0px 0px 0px 0px;
  z-index: 4;

}




#main-text4:hover #main-square {
  border-radius: 0% 0% 0% 0%;
  background-position: right bottom;
  height: 91%;
  width: 15px;
}





.box-righe2:hover #main-square {
  height: 59vh;
}
.box-righe2:hover #main-square3 {
background-position: right bottom;
}

#bgrighe{
height: 100vh;
border-bottom: 0px solid;
transition: 3s;
top:0vh;
overflow:visible;
}



.box-righe1 {
width: 100%;
position: absolute;
background: transparent;
min-height: 35vh;
overflow: visible;
margin: 0;
padding: 0px 0px 0px 0px;
z-index:3;
top:20vh;
}
.box-righe2 {
width: 100%;
  position: relative;
  background: transparent;
height: 80vh;
  overflow: visible;
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  z-index: 3;
  border-top: 0px solid #f26008;
  top: 9.5vh;
}

.box-righe2 p {
width: 80%;
float: right;
color: #736869;
text-align: left;
padding: 5px 5px 5px 0px;
font-size: 12px;
line-height: 1.2;
border-radius: 0px 0px 20px 20px;
left: 0;
top: 2vw;
border-top: 0px;
position: relative;
}

.box-righe2:hover p {
color:#797676
}

.box-righe2 h3 {
padding: 10px 0px 500px 0px;
color: #f26008;
font-size: 25px;
font-weight: bold;
letter-spacing: 0px;
float: right;
position: relative;
text-align: left;
line-height: 98%;
left: 0;
width: 80%;
margin: 0;
}

.riga1 {
width: 40vw;
height: 40vw;
position: absolute;
top: 0vh;
left: 16vw;
z-index: 2;
transition: 2s;
border: 10px solid #f26008;
border-radius: 50% 50% 50% 0%;
border-left: 0px;
border-bottom: 0px;
}

.riga2 {
width: 40vw;
height: 40vw;
position: absolute;
top: 0;
left: 16vw;
z-index: 2;
transition: 5s;
background: transparent;
border-radius: 100% 100% 100% 100%;
border: 5px solid #f26008;
border-bottom: 0px;
border-left: 0px;
}

.riga3 {
width: 5%;
min-height: 2vh;
position: absolute;
top: 0vh;
right: 0;
transition: 8s 2s;
border: 10px solid #f26008;
padding: 0px 0px 0px 0px;
border-left: 0;
border-right: 0;
background: #161514 url(../images/campozoom/img_home1.jpg);
background-repeat: repeat-y;
background-attachment: scroll;
background-size: 100%;
background-position: center center;

}


.riga4 {
width: 15vh;
  height: 15vh;
  min-height: 15vh;
  position: relative;
  top: -20vh;
  left: 20%;
z-index: 2;
transition: 6s 2s;
background: #f26008 url(../images/campozoom/riga4.jpg);
background-repeat: no-repeat;
background-attachment: scroll;
background-size: 0% 100%;
background-position: 100% 0%;
border-radius: 100% 100% 100% 100%;
float: right;
border-right: 0px;
box-shadow: 0px 0px 0px 0px #000;
margin: 0px 0px -5px 0px;
}
.box-righe2:hover .riga4 {
background-size: 100% 100%;
rotate: -90deg;
}
#vertical_network {
position:absolute;
top:8vh;z-index:4;
}
#vertical_network p {
width: auto;
height: auto;
font-size: 1vw;
font-family: 'Sans-serif', Tahoma, 'Times New Roman', Arial, sans-serif;
overflow: hidden;
color: #f26008;
border: 2px solid #f26008;
background: #161514;
padding: 15px 5px 15px 5px;
text-align: left;
margin: 0vh 0vh 0vh 0vh;
float: left;
border-radius: 8px 0px 0px 8px;
border-right: 0px;
box-shadow: 0px 0px 0px 0px #000;
writing-mode: vertical-lr;
word-wrap: anywhere;
white-space: nowrap;
line-height: 1;
rotate: 180deg;
}
#vertical_code {
position:absolute;
top:33vh;z-index:4;
}
#vertical_code p {
width: auto;
height: auto;
font-size: 1vw;
font-family: 'Sans-serif', Tahoma, 'Times New Roman', Arial, sans-serif;overflow: hidden;
color: #f26008;
border: 2px solid #f26008;
background: #161514;
padding: 15px 5px 15px 5px;
text-align: left;
margin: 0vh 0vh 0vh 0vh;
float: left;
border-radius: 8px 0px 0px 8px;
border-right: 0px;
box-shadow: 0px 0px 0px 0px #000;
writing-mode: vertical-lr;
word-wrap: anywhere;
white-space: nowrap;
line-height: 1;
rotate: 180deg;
}
#vertical_graphic {
position:absolute;
top:56vh;z-index:4;
}
#vertical_graphic p {
width: auto;
height: auto;
font-size: 1vw;
font-family: 'Sans-serif', Tahoma, 'Times New Roman', Arial, sans-serif;
overflow: hidden;
color: #f26008;
border: 2px solid #f26008;
background: #161514;
padding: 15px 5px 15px 5px;
text-align: left;
margin: 0vh 0vh 0vh 0vh;
float: left;
border-radius: 8px 0px 0px 8px;
border-right: 0px;
box-shadow: 0px 0px 0px 0px #000;
writing-mode: vertical-lr;
word-wrap: anywhere;
white-space: nowrap;
line-height: 1;
rotate: 180deg;
}
#vertical_html {
position:absolute;
top:5vh;z-index:4;
}
#vertical_html p {
width: auto;
height: auto;
font-size: 20px;
font-family: 'Sans-serif', Tahoma, 'Times New Roman', Arial, sans-serif;
overflow: hidden;
color: #f26008;
border: 2px solid #f26008;
background: #161514;
padding: 15px 5px 15px 5px;
text-align: left;
margin: 0vh 0vh 0vh 0vh;
float: left;
transition: 5s;
border-radius: 8px 0px 0px 8px;
border-right: 0px;
box-shadow: 0px 0px 0px 0px #000;
writing-mode: vertical-lr;
word-wrap: anywhere;
white-space: nowrap;
line-height: 1;
rotate: 180deg;
}


.riga4overlay {
width: 100%;
height: 100%;
position: absolute;
background: transparent url(../images/campozoom/riga4overlay.png);
background-repeat: no-repeat;
background-attachment: scroll;
background-size: cover;
background-position: 0% 50%;
margin: 0px auto;
border-radius:100%;
border: 20px solid #f26008;
transition: 7s;
left: 0;
box-shadow: 0px 0px 50px 0px #000 inset, 0px 0px 150px 0px #000;
}

.riga5 {
width: 50vw;
height: 300px;
position: absolute;
top: 70vh;
right: 2%;
z-index: 2;
transition: 2s;
border: 2px solid #f26008;
background: #161514;
border-radius: 20px;
}




.pipe1 {
width: 40%;
min-height: 50vh;
position: absolute;
z-index: 0;
transition: 6s;
border: 0vw solid #f26008;
background: transparent;
border-radius: 100%;
left: 48vw;
top: 0vw;

}


.riga7 {
width: 11vh;
  height: 11vh;
  min-height: 9vh;
  position: absolute;
  top: -3vh;
  left: -3vh;
  z-index: 2;
  transition: 1s;
  border-right: 0px solid #f26008;
  border-top: 2px solid #f26008;
  border-left: 2px solid #f26008;
  border-bottom: 0px solid #f26008;
  border-radius: 100% 0% 0% 0%;
  float: right;
}


#graphic_screen1 {
width: 100%;
height: 90vh;
float: right;
margin: 20px 0px 0px 0px;
background: transparent;
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
transition: 300ms;
overflow: hidden;
position: absolute;
top: 105vh;
left: 0px;
}




#graphic_screen2 {
width: 42%;
height: 60vh;
float: right;
margin: 20px 0px 0px 0px;
background: #161514d6;
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
transition: 1s ease-in-out;
overflow: hidden;
border: 2px solid #f26008;
border-radius: 0px 2000px 200px 0px;
position: absolute;
top: 0px;
left: 0px;
}
#graphic_screen1:hover #graphic_screen2 {width:100%;height:40vh;border-radius:0px 0px 0px 0px;}

.riga8 {
width: 15vh;
  height: 15vh;
  min-height: 15vh;
  position: absolute;
  top: 8vh;
  left: -8vh;
  z-index: 2;
  transition: 1s;
  border-right: 0px solid #f26008;
  border-top: 0px solid #f26008;
  border-left: 2px solid #f26008;
  border-bottom: 2px solid #f26008;
  border-radius: 0% 0% 0% 100%;
  float: right;
}









.box-righe1:hover .riga1 {
height: 40vw;
width: 40vw;
rotate: 360deg;
}
.box-righe1:hover .riga2 {
width: 40vw;
height: 40vw;
left: 15vw;
border-radius: 100% 100% 100% 100%;
}

.box-righe2:hover .box-mano {
top:55vh;
}
.box-righe2:hover .riga3 {
min-height: 80vh;
}
.frange1:hover .pipe1 {
border-radius: 20px;
border: 20vw solid #f26008;
top: 46vh;
left: -30%;
}

.box-righe2:hover .riga5 {
animation:shake 5s;
}






.frange1 {
width: 100%;
border: 0px solid #161514;
position: relative;
background: #161514 url(../images/campozoom/frange1mobile.jpg);
  background-attachment: scroll;
background-repeat: no-repeat;
background-attachment: scroll;
background-size: auto;
transition: 18s;
overflow: hidden;
box-shadow: 0px 0px 0px 0px #000 inset;
margin: 0;
padding: 0px 0px 0px 0px;
background-position: 150% 0%;
min-height: 20vh;
}


.frange1overlay {
background: transparent url(../images/campozoom/frange1overlaymobile.png);
background-repeat: repeat;
background-size: contain;
background-position: 120% 0%;
position: relative;
height: auto;
min-height: 105vh;
width: 100%;
transition: 12s ease;
bottom: 0%;
left: 0%;
z-index:3;
}



.frange1:hover  {
background-position: 0% 40%;
}
.frange1:hover .frange1overlay {
background-position: 20% 0%;
}


.frange1 h2  {
margin: 0px 0px 0px 0px;
padding: 0vh 0vh;
font-size: 20em;
text-align: center;
text-shadow: 0px 0px 0px #000;
color: #f26008;
line-height: 85%;
transition: 4s 1s;
letter-spacing: 2px;
position: absolute;
width: auto;
height: auto;
bottom: 0%;
word-break: break-all;
z-index: 4;
left: 9%;
}

.frange1:hover h2 {
  letter-spacing: -10px;
}


.box-portfolio {
width: 100%;
height: 100vh;
  transition: 1s cubic-bezier(1,0,.49,.78);
  padding: 0px 0px 0px 0px;
  z-index: 2;
}

#portfolio1 {
  background: transparent url(../images/graphic/yellowPAG8.jpg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: right center;
  margin: 0;
  padding: 0px 0px 0px 0px;
}

#portfolio2 {
  background: transparent url(../images/graphic/yellowPAG2.jpg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: right center;
  margin: 0;
  padding: 0px 0px 0px 0px;
}

#portfolio3 {
  background: transparent url(../images/graphic/yellowPAG3.jpg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: right center;
  margin: 0;
  padding: 0px 0px 0px 0px;
}

#portfolio4 {
  background: transparent url(../images/graphic/yellowPAG7.jpg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  margin: 0;
  padding: 0px 0px 0px 0px;
}









/*-- SERVIZI   -- */



.main-servizi {
width: 100%;
  min-height: 80vh;
  margin: 0px auto;
  position: relative;
  z-index: 2;
  padding: 0px 0px 0px 0px;
  background: transparent;
  overflow: hidden;
}




.bigbox1 { height: auto;
margin: 0px auto;
overflow: visible;
min-height: 50vh;
border: 0px solid #ff00005e;
padding: 0px 0px 0px 0px;
float: left;
width: 100%;
z-index: 7;
  position: relative;
}

.bigbox2, .bigbox3 { height: auto;
margin: 0px auto;
overflow: visible;
min-height: 25vh;
border: 0px solid #ff00005e;
padding: 0px 0px 10px 0px;
transition: 2s;
float: left;
width: 100%;
}



.bigbox4,.bigbox5,.bigbox6  {
  height: auto;
  margin: 0px auto;
  overflow: visible;
  min-height: 20vh;
  border: 0px solid #ff00005e;
  padding: 0px 0px 10px 0px;
  transition: 2s;
  float: right;
  width: 100%;
}

.bigbox7 {
margin: 0px auto;
  overflow: hidden;
  min-height: 60vh;
  border: 0px solid #ff00005e;
  padding: 0px 0px 0px 0px;
  transition: 2s;
  width: 100%;
  position: absolute;
  top: 12%;
}


.bigbox8 {
height: auto;
  margin: 0px 0px 0px 140px;
  overflow: visible;
  min-height: 77vh;
  border-radius: 20px;
  padding: 0px 0px 10px 0px;
  transition: 2s;
  float: left;
  width: 40%;
  position: absolute;
  top: 300px;
opacity: 0.5;
}
.bigbox9 {
height: auto;
  margin: 0px 0px 0px 0px;
  overflow: visible;
  min-height: 60vh;
  border-radius: 20px;
  padding: 0px 0px 10px 0px;
  transition: 2s;
  width: 100%;
  position: absolute;
  bottom: 0;
  opacity: 0.5;
  border: 0px solid red;
opacity: 0.5;
}
.bigbox10, .bigbox11, .bigbox12  {
  height: auto;
  margin: 0px auto;
  overflow: visible;
  min-height: 70vh;
  border: 0px solid #ff00005e;
  padding: 0px 0px 10px 0px;
  transition: 2s;
  float: right;
  width: 100%;
}

.servizi-two-third {
  position: relative;
  margin-right: 0px;
  float: left;
  width: 66%;
}
.servizi-one-third {
  position: relative;
  margin-right: 0px;
  float: left;
  width: 33.3%;
}


.servizi1 {
  width: 100%;
  position: absolute;
  background: #161514 url(../images/campozoom/servizi1.jpg);
  background-repeat:no-repeat;
    background-size: 100%;
  background-position: top center;
  height: 50vh;
  border-radius: 0% 0% 0% 0%;
  overflow: visible;
  margin: 0px 0px 0px 0px;
  padding:0px 0px 0px 0px;
  border: 0px solid #171515;
  }
.servizi2, .servizi3  {
width: 50%;
position: absolute;
height: 25vh;
transition: 1s cubic-bezier(1,0,.49,.78);
border-radius: 0% 0% 0% 0%;
overflow: visible;
box-shadow: 0px 0px 20px 0px #000 inset;
margin: 0;
padding:0px 0px 0px 0px;
border: 0px solid #171515;
}
.servizi2 {
background: #232323 url(../images/section2/servizi2.jpg);
background-position: 0vh 25vh;
background-size:contain;
background-repeat:no-repeat;
}
.servizi3 {
background: #232323 url(../images/section2/servizi3.jpg);
background-position: -25vh 0vh;
background-size:contain;
background-repeat:no-repeat;
}
.servizi4, .servizi5, .servizi6  {
width: 100%;
position: absolute;
height: 20vh;
transition: 1s cubic-bezier(1,0,.49,.78);
border-radius: 0% 0% 0% 0%;
overflow: visible;
box-shadow: 0px 0px 20px 0px #000 inset;
margin: 0;
padding:0px 0px 0px 0px;
border: 0px solid #171515;
}

.servizi4 {
background: #232323 url(../images/section2/servizi4.jpg);
background-position: left center;
background-size:contain;
background-repeat:no-repeat;
}
.servizi5 {
background: #232323 url(../images/section2/servizi5.jpg);
background-position: left center;
background-size:contain;
background-repeat:no-repeat;
}
.servizi6 {
background: #232323 url(../images/section2/servizi6.jpg);
background-position: left center;
background-size:contain;
background-repeat:no-repeat;
}







.servizi7 {
width: 100%;
  position: absolute;
  background: #161514 url(../images/campozoom/bgabout.jpg);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center right;
  height: 60vh;
  transition: 1s cubic-bezier(1,0,.49,.78);
  overflow: visible;
  margin: 0px auto;
  padding: 0px 0px 0px 0px;
  border: 0px solid red;
  opacity: 0.7;
}
.servizi8 {
width: 100%;
position: absolute;
  background: #161514 url(../images/campozoom/servizi8.jpg);
background-size: cover;
background-position: center center;
background-repeat:no-repeat;
height: 70vh;
transition: 1s cubic-bezier(1,0,.49,.78);
overflow: visible;
margin: 0;
padding:0px 0px 0px 0px;
border: 0px solid red;
border-radius: 0px;
opacity: 0.2;
}
.servizi9 {
width: 100%;
  position: absolute;
  background: transparent;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  height: 100%;
  transition: 1s cubic-bezier(1,0,.49,.78);
  overflow: visible;
  margin: 0;
  padding: 0px 0px 0px 0px;
  border: 0px solid red;
  border-radius: 0px;
}
.servizi11,.servizi12  {
width: 100%;
position: absolute;
background: #232323;
background-size: contain;
background-position: center center;
height: 20vh;
transition: 1s cubic-bezier(1,0,.49,.78);
border-radius: 0% 0% 0% 0%;
overflow: visible;
box-shadow: 0px 0px 20px 0px #000 inset;
margin: 0;
padding:0px 0px 0px 0px;
border: 0px solid #171515;
}
.servizi10 {
width: 100%;
  position: absolute;
  background: #161514 url(../images/campozoom/servizi10.jpg);
  background-size: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  height: 100%;
  transition: 1s cubic-bezier(1,0,.49,.78);
  overflow: visible;
  margin: 0;
  padding: 0px 0px 0px 0px;
  border: 0px solid red;
  border-radius: 0px;
}


.servizi1:hover{
padding: 0px 0px 0px 0px;
}
.servizi2:hover {
background: #f26008 url(../images/section2/servizi2.jpg);
background-position: 0vh 0vh;
background-size:contain;
background-repeat:no-repeat;
transition: 1s cubic-bezier(1,0,.49,.78);
}
.servizi3:hover {
background: #f26008 url(../images/section2/servizi3.jpg);
background-position: 0vh 0vh;
background-size:contain;
background-repeat:no-repeat;
transition: 1s cubic-bezier(1,0,.49,.78);
}
.servizi4:hover {
background: #f26008 url(../images/section2/servizi4.jpg);
background-position: right center;
background-size:contain;
background-repeat:no-repeat;
transition: 1s cubic-bezier(1,0,.49,.78);
}
.servizi5:hover {
background: #f26008 url(../images/section2/servizi5.jpg);
background-position: right center;
background-size:contain;
background-repeat:no-repeat;
}
.servizi6:hover {
background: #f26008 url(../images/section2/servizi6.jpg);
background-position: right center;
background-size:contain;
background-repeat:no-repeat;
}

.servizi7:hover {
padding: 0px 0px 0px 0px;
}
.servizi8:hover {
padding: 0px 0px 0px 0px;
}
.servizi9:hover {
padding: 0px 0px 0px 0px;
}

.servizi10:hover {background-size: 100% 100%;
background: #ea6809;
padding: 0px 0px 0px 0px;
}
.servizi11:hover {background-size: 100% 100%;
background: #ea6809;
padding: 0px 0px 0px 0px;
}
.servizi12:hover {background-size: 100% 100%;
background: #ea6809;
padding: 0px 0px 0px 0px;
}





.servizi1overlaysx, .servizi2overlaysx, .servizi3overlaysx, .servizi4overlaysx,
.servizi5overlaysx, .servizi6overlaysx, .servizi7overlaysx, .servizi8overlaysx,
.servizi9overlaysx, .servizi10overlaysx, .servizi11overlaysx, .servizi12overlaysx   {
position: relative;
top: 0;right:0;
width: 100%;
border-radius: 0% 0% 0% 0%;
background: #232323;
transition: 2s;
height: 100%;
box-shadow: 0px 0px 0px 0px #000;
}



.servizi1overlaysx{
background: #161514 url(..//images/campozoom/servizi_overlay_1.jpg) no-repeat;
  background-size: 100%;
  background-position: top center;
  float: left;
  transition: 1s cubic-bezier(1,0,.49,.78);
  width: 100%;
  height: 50vh;
}
.servizi2overlaysx{
background:#161514 url(../images/campozoom/servizi2.jpg)no-repeat;
background-size:contain;background-position:right center;
}
.servizi3overlaysx{
background:#161514 url(../images/campozoom/servizi3.jpg)no-repeat;
background-size:contain;background-position:right center;
}
.servizi4overlaysx{
background:#161514 url(../images/campozoom/servizi4.jpg)no-repeat;
background-size:contain;background-position:right center;
}
.servizi5overlaysx{
background:#161514 url(../images/campozoom/servizi5.jpg)no-repeat;
background-size:contain;background-position:right center;
}
.servizi6overlaysx{
background:#161514 url(../images/campozoom/servizi6.jpg)no-repeat;
background-size:contain;background-position:right center;
}
.servizi7overlaysx{
background:#161514;
background-size:contain;background-position:right center;
}
.servizi8overlaysx{
background:#161514;
float: right;
}
.servizi9overlaysx{
background:#161514;
float: right;
}
.servizi10overlaysx {
background:transparent;
float: right;

}

.servizi11overlaysx, .servizi12overlaysx {
background:#161514;
float: right;
}


.servizi1:hover .servizi1overlaysx {
height:0vh;
}

.servizi2:hover .servizi2overlaysx {
top:100%;
}

.servizi3:hover .servizi3overlaysx {
right:100%;
}
.servizi4:hover .servizi4overlaysx {
width: 50%;
}
.servizi5:hover .servizi5overlaysx {
width: 50%;
}
.servizi6:hover .servizi6overlaysx {
width: 50%;
}
.servizi7:hover .servizi7overlaysx {
width:120px;
float:left;
opacity: 0.2;
}
.servizi8:hover .servizi8overlaysx {
width:2%;
float:right;
opacity: 0.2;border-radius:0px;
}
.servizi9:hover .servizi9overlaysx {
width:2%;
float:right;
opacity: 0.2;border-radius:0px;
}
.servizi10:hover .servizi10overlaysx {
width:20%;float: right;
}
.servizi11:hover .servizi11overlaysx {
width:20%;float: right;
}
.servizi12:hover .servizi12overlaysx {
width:20%;float: right;
}



.servizi1 h2 {
right:50%;
}
.servizi2 h2 {
top:50%;
}
.servizi3 h2 {
right:50%;
}
.servizi4 h2 {
right: 50%;
  font-size: 4vh;
  padding: 8vh 6vh 0vh 6vh;
}
.servizi5 h2 {
right:50%;
  font-size: 4vh;
  padding: 8vh 6vh 0vh 6vh;
}
.servizi6 h2 {
right:50%;
  font-size: 4vh;
  padding: 8vh 6vh 0vh 6vh;
}
.servizi7 h2 {
right:50%;
}
.servizi8 h2 {
top:50%;
}
.servizi9 h2 {
top:50%;
}
.servizi10 h2, .servizi11 h2, .servizi12 h2   {
top:50%;
}


.servizi1:hover h2 {
  right: 0px;
  color: #f26008;
  animation: flicker 3s linear infinite;
}
.servizi2:hover h2 {
top:0;
}
.servizi3:hover h2 {
right:0;
}
.servizi4:hover h2 {
right:0;
}
.servizi5:hover h2 {
right:0;
}
.servizi6:hover h2 {
right:0;
}
.servizi7:hover h2 {
right:0;
}
.servizi8:hover h2 {
top:0;
}
.servizi9:hover h2 {
top:0;
}
.servizi10:hover h2 {
top:0;
}
.servizi11:hover h2 {
top:0;
}
.servizi12:hover h2 {
top:0;
}


.servizi3 h2, .servizi5 h2, .servizi6 h2 {

  position: inherit;
  text-shadow: 0px 0px 2px #f26008;
  color: #dddbdb;
  margin: 0px 0px 0px 0px;
  line-height: 99%;
  transition: 1s cubic-bezier(1,0,.49,.78);
  width: auto;
  word-wrap: break-word;
  position: absolute;
  text-align: center;
  letter-spacing: 0px;
}
.servizi10 h2, .servizi11 h2, .servizi12 h2 {
font-size: 2em;
  position: inherit;
  text-shadow: 0px 0px 2px #f26008;
  color: red;
  margin: 0px 0px 0px 0px;
  padding: 20px 20px 0px 0px;
  line-height: 99%;
  transition: 1s cubic-bezier(1,0,.49,.78);
  width: auto;
  word-wrap: break-word;
  position: absolute;
  text-align: center;
  letter-spacing: 0px;
}

.servizi1 h2, .servizi2 h2, .servizi4 h2, .servizi7 h2, .servizi8 h2, .servizi9 h2  {
  position: inherit;
  text-align: right;
  color: #161514;
  margin: 0px 0px 0px 0px;
  line-height: 95%;
  transition: 1s cubic-bezier(1,0,.49,.78);
  letter-spacing: 1px;
  width: auto;
}

.servizi1 h3, .servizi2 h3, .servizi3 h3, .servizi4 h3, .servizi7 h3, .servizi8 h3, .servizi9 h3
.servizi10 h3, .servizi11 h3, .servizi12 h3 {
font-size: 4em;
position: relative;
text-align: left;
color: #806b50;
margin: 10px 10px 10px 10px;
padding: 1px 1px 1px 1px;
transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
width: auto;
font-weight: normal;
letter-spacing: -5px;
line-height: 90%;
border: 1px solid;
height: auto;
}
.servizi1 p, .servizi2 p, .servizi3 p, .servizi4 p, .servizi5 p, .servizi6 p, .servizi7 p, .servizi8 p,
.servizi10 p, .servizi11 p, .servizi12 p {
font-size: 1em;
padding: 20px 20px 20px 20px;
transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
line-height: 110%;position:relative;
}
.servizi9 p {
font-size: 2em;color:#161514;font-weight:bold;
padding: 20px 20px 20px 20px;
transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
line-height: 110%;position:relative;
}
.servizi1 h4, .servizi2 h4, .servizi3 h4, .servizi4 h4, .servizi7 h4, .servizi8 h4, .servizi9 h4
.servizi10 h4, .servizi11 h4, .servizi12 h4   {
font-size: 12em;
left: 0;
width: auto;
color: #d75608;
height: auto;
padding: 0px 60px 0px 20px;
margin: 0px 0px 0px 0px;
transition: 1s 300ms cubic-bezier(1,0,.49,.78);
overflow: visible;
position: absolute;
z-index: 99;
background: transparent;
letter-spacing: -10px;
text-shadow: 0px 0px 10px #000;
text-align: center;
line-height: 1;
border-radius: 990px 8px 990px 0px;
bottom: 50px;
mix-blend-mode: color-dodge;opacity: 0.5;
}








.servizi1:hover h4 {background: #df520c;
color: #232323;
}



.servizi1:hover h3 {
animation: bounce 1s;
color: #1e1c1c;
height: auto;
}




/*-- SERVIZI END -- */























/*-- LITTLE-BOOKS4  -- */

.littlebook4 {width: 40vh;position:absolute;left:50%;
background: transparent;
background-size: 110% 110%;
background-position: center center;
height: 40vh;
transition: 1s cubic-bezier(1,0,.49,.78);
  transition-property: all;
  transition-duration: 1s;
  transition-timing-function: cubic-bezier(1, 0, 0.49, 0.78);
  transition-delay: 0s;
border-radius: 8px 8px 8px 8px;
overflow: visible;box-shadow: 0px 0px 2px 0px #000;
overflow:visible;
}
.littlebook4:hover {background-size: 110% 110%;box-shadow: 16px 16px 32px #5c0000, 0px 0px 0px #f00;
}
.little4overlaydx {
	position: relative;
	top: 0;
	right: 0;
	width: 50%;
   height: 10vh;
	opacity: 1;
	transition: 800ms cubic-bezier(1,0,.49,.78);
	background-color: #f44906;
   z-index:1;
}
.little4overlaysx {right: 50%;
height: 40vh;
width: 0%;
	position: absolute;
	opacity: 1;
	transition: 1s cubic-bezier(1,0,.49,.78);
	background-color: #f8d499;
}
.littlebook4:hover .little4overlaysx {
  opacity: 1;width:0%;right: 60%;height:0vh;
}
.littlebook4:hover .little4overlaydx {
   opacity: 1;width:0%;right: 60%;height:0vh;
}





.littlebook4 h2 {font-size: 3em;
left: 0;
position: absolute;
text-align: left;
text-shadow: 0px 0px 2px #000;
color: #b80000;
margin: 0px 0px 0px 0px;
padding: 20px 20px 20px 15px;
line-height: 85%;
transition: 1s cubic-bezier(1,0,.49,.78);
letter-spacing: -2px;
background: transparent;
}
.littlebook4 h3{font-size:1em;
position: relative;
text-align: center;
color: #232323;
margin: 0px 0px 0px 0px;
padding: 20px 0px 0px 40px;
line-height: 1;
transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
width: 100%;
}
.littlebook4 p {font-size: 0.8em;
left: 0;
width: 88%;
position: absolute;
background: transparent;
color: red;
height: auto;
padding: 20px 20px 20px 20px;
top:70%;
transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
line-height: 110%;

}
.littlebook4 h4 {font-size: 1em;
left: 0;
width: 100%;
position: relative;
background: transparent;
color: red;
height: auto;
padding:20px 20px 20px 20px;
margin:40px 0px 0px 0px;
transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
}


.littlebook4:hover h4 {font-size: 1em;
left: 0;
position: relative;
background: #e80d0d;
color: #f8d499;
height: auto;
}
.littlebook4:hover p {
left: 0;
background: transparent;
color: #f8d499;
height: auto;top:45%;
}
.littlebook4:hover h2 {
left: 0;
color: #fff;
background: red;
height: auto;
text-shadow: 0px 0px 5px #000;
}
.littlebook4:hover h3 {
animation: bounce 1s;
left:0;
width:100%;
background:transparent;
color:#232323;
height:auto;
padding: 10px 0px 0px 70px;
}

/*-- LITTLE BOOKS 4 END -- */





/*-- CAMPO DROP 6 -- */

.campodrop6 {background: #232323b8;position:absolute;
color: #020e26;
padding: 0px 0px;
width:100%;
height:50vh;
overflow: hidden;
transform: translate(0);
transition:5s;}
.campodrop6:hover {background:#232323b8;}
.campodrop6::before {content: "";
position: absolute;
top: 0;
right: 0;
z-index: -1;
background: linear-gradient( to right, #8a030391, #d4420085 );
width: 100%;
height: 100%;
transition: 2s; }
.campodrop6:hover::before {transform: scale(1.5, 3);border-radius: 0px 8px 8px 0px;}
.campodrop6 h2{text-align:left;font-size:50px;color:red;margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;line-height:1;transition:1s;}

/*-- CAMPO DROP 6 end -- */



/*-- LITTLE-BOOKS 5 -- */

.littlebook5 {
width: 100%;height:150px;
  border: 5px solid #d9741b;
  background: #d21616;
  background-size: auto;
  background-size: 110% 110%;
  background-position: center center;
  transition: 1s cubic-bezier(1,0,.49,.78);
  border-radius: 8px;
  box-shadow: 0px 0px 2px 0px #000;
  overflow: visible;

}
.littlebook5:hover {background-size: 100% 100%;
}
.little5overlaydx { position: absolute;
left: 0;
height: 0vh;
width: 70%;
transition: 800ms cubic-bezier(1,0,.49,.78);
background-color: #d44200;
z-index: 1;
opacity: 0;
}

.little5overlaysx {right: 50%;
height: 40vh;
width: 0%;
	position: absolute;
	opacity: 1;
	transition: 1s cubic-bezier(1,0,.49,.78);
	background-color: #f8d499;
}
.littlebook5:hover .little5overlaysx {
  opacity: 1;width:40%;right: 60%;height:10vh;
}
.littlebook5:hover .little5overlaydx {
height: 80vh;
opacity: 1;
}





.littlebook5 h2 {
font-size: 25px;
  left: 0;
  margin: 0px 0px 0px 0px;
  position: absolute;
  text-align: left;
  color: #232323;
  line-height: 1;
  transition: 1s cubic-bezier(1,0,.49,.78);
  letter-spacing: 0px;
  top: 50%;
  text-shadow: 0px 0px 5px #000;
  transform: translate(0%, -50%);
  z-index: 5;
}
.littlebook5 h3{font-size: 2em;
position: relative;
text-align: right;
color: #232323;
margin: 0px 0px 0px 0px;
padding: 20px 0px 0px 40px;
line-height: 1;
transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
width: 100%;
padding: 10px 10px 10px 70px;
}
.littlebook5 p {font-size: 1.2em;
left: 0;
width: 75%;
position: relative;
background: transparent;
height: auto;
padding: 20px 20px 20px 20px;
color: #f8d499;
top: 0;
transition: 600ms 300ms cubic-bezier(1,0,.49,.78);
line-height: 110%;

}
.littlebook5 h4 { font-size: 13em;
right: 0;
width: 110%;
color: #f44906;
height: auto;
padding: 0px 50px 0px 0px;
margin: 0px 0px 0px 0px;
transition: 1s 300ms cubic-bezier(1,0,.49,.78);
overflow: visible;
position: absolute;
z-index: 99;
background: transparent;
letter-spacing: -10px;
text-shadow: 0px 0px 5px #000;
text-align: right;
line-height: 1;
}


.littlebook5:hover h4 {background: #595756;;
color: #232323;
}
.littlebook5:hover p {
color: #f8d499;
top: 0;
}
.littlebook5:hover h2 {
left: -20%;
width: 100%;
background:transparent;
height:auto;
text-shadow: 0px 0px 5px #000;
}
.littlebook5:hover h3 {
width: 100%;
background: #977d7d;
color: #232323;
height: auto;
padding: 10px 10px 10px 70px;
}

/*-- LITTLE BOOKS5 END -- */
































.camposx { background:transparent url(../images/campozoom/sinistra.jpg)no-repeat;
				background-size:cover;background-position:center center;
            border:0px solid yellow;height:40vw;width:50%;float:left;
				box-sizing: border-box;
				box-shadow: 0px 0px 0px 0px inset #000;
				overflow: hidden;
				backdrop-filter: blur(0px);
z-index: 3;
position: relative;
transition: 2s;

}
.camposx:hover { width:55%;float:left;transition: 2s;transform: scale(1.2);
				}





.campodx { background:transparent url(../images/campozoom/destra.jpg)no-repeat;
				background-size:cover;background-position:center center;
            border:10px solid #000;height:40vw;transition: 400ms;
				box-sizing: border-box;
				box-shadow: 0px 0px 0px 0px inset #000;
				overflow: hidden;
				backdrop-filter: blur(0px);
				z-index: 5;
				position: relative;

}

.campodx h2{text-align:left;font-size:50px;color:red;margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;line-height:1;transition:1s;}






























.tracker {
position:fixed;
transform: translate(-50%, -50%);
width:50px;
z-index:9999;
pointer-events:none;
transition:all .15s;
}

/*--BACKGROUND ANIMATO  -- */

.backblock { background:transparent;border:0px solid #000;height:10vw;width:10vw;float:left;transition: 4s;box-sizing: border-box;
box-shadow: 0px 0px 30px 0px inset #000;}
.backblock:hover { border:0px solid red;background:transparent;transition:400ms;
						 animation:200ms linear 0s pulse, 300ms linear 1s 2 alternate psychedelic;
						 box-shadow: 0px 0px 0px 0px inset #000;}


.backblock h1{text-align:center;font-size:70px;color:red;margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;line-height:1;transition:1s;}
.backblock:hover h1{ border: 0px solid red;background: transparent;transition: 400ms;animation:200ms linear 0s pulse;color:#fff;margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;line-height:1;}

.backblock_black { background:transparent;border:0px solid red;height:10vw;width:10vw;float:left;transition: 30s;box-sizing: border-box;
box-shadow: 0px 0px 0px 0px inset #000;}
.backblock_black:hover { border:0px solid red;background:#bb0000;transition:400ms;
						 animation:200ms linear 0s pulse, 300ms linear 1s 2 alternate psychedelic;
						 box-shadow: 0px 0px 50px 0px  #000;}

.blurred_bg {
      position: absolute;
      left: 0px;
      top: 0px;
      z-index: -1;
      width: 100%;
      height: 100%;
      -webkit-filter: blur(10px); /* Safari 6.0 - 9.0 */
      filter: blur(10px);
      }



/*--BACKGROUND ANIMATO 2 -- */
.freeblock { background: transparent;
border: 1px solid #5e0303;
height: 10vw;
width: 10vw;
float: left;
transition: 45s;
box-sizing: border-box;
box-shadow: 0px 0px 5px 0px inset #000;
overflow: hidden;}
.freeblock:hover { border: 0px solid red;
background: #b80000;
transition: 400ms;
animation: 200ms linear 0s pulse, 300ms linear 1s 2 alternate psychedelic;
box-shadow: 0px 0px 50px 0px #000;}


.freeblock_black { background:transparent;border:1px solid red;height:10vw;width:10vw;float:left;transition: 40s;box-sizing: border-box;
box-shadow: 0px 0px 0px 0px #000;}
.freeblock_black:hover { border:0px solid red;background:#b80000;transition:400ms;
						 animation:200ms linear 0s pulse, 300ms linear 1s 2 alternate psychedelic;
						 box-shadow: 0px 0px 50px 0px  #000;}


/*--BACKGROUND ANIMATO 3 -- */
.photoblock { background: #b80000 !important;
border: 0px solid #5e0303;
height: 10vw;
width: 10vw;
float: left;
transition: 75s;
box-sizing: border-box;
box-shadow: 0px 0px 0px 0px inset #000;
overflow: hidden;}
.photoblock:hover { border: 0px solid red;
background: transparent !important;
transition: 400ms;
animation: 200ms linear 0s pulse, 300ms linear 1s 2 alternate psychedelic;
box-shadow: 0px 0px 50px 0px #000;}


.photoblock_black { background:transparent;border:0px solid red;height:10vw;width:10vw;float:left;transition: 4s;box-sizing: border-box;
box-shadow: 0px 0px 0px 0px #000;}
.photoblock_black:hover { border:0px solid red;background: transparent;transition:400ms;
						 animation:200ms linear 0s pulse, 3s linear 0s 2 alternate psychedelic;
						 box-shadow: 0px 0px 0px 0px  #000;}








/*--BACKGROUND ANIMATO 3 -- */
.marketblock { background: #b80000 !important;
border: 0px solid #5e0303;
height: 10vw;
width: 10vw;
float: left;
transition: 25s;
box-sizing: border-box;
box-shadow: 0px 0px 0px 0px inset #000;
overflow: hidden;}
.marketblock:hover { border: 0px solid red;
background: transparent;
transition: 0s;
animation: 200ms linear 0s pulse, 3s linear 0s 2 alternate psychedelic;
box-shadow: 0px 0px 50px 0px #000;
opacity: 0;}




/*--BACKGROUND ANIMATO 4 -- */
.blurblock { background: transparent;
border: 0px solid #5e0303;height: 10vw;width: 10vw;float: left;transition: 25s;box-sizing: border-box;
box-shadow: 0px 0px 0px 0px inset #000;overflow: hidden;backdrop-filter: blur(0px);}

.blurblock:hover {border: 0px solid red;
background: #b80000;
transition: 150ms;
animation: 200ms linear 0s pulse alternate, 400ms linear 1s 2 alternate psychedelic;
box-shadow: 0px 0px 50px 0px red;
backdrop-filter: blur(10px);
}











#photo_wall1 { background:transparent url(../images/squarewall/photo1.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall2 { background:transparent url(../images/squarewall/photo2.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall3 { background:transparent url(../images/squarewall/photo3.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall4 { background:transparent url(../images/squarewall/photo4.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall5 { background:transparent url(../images/squarewall/photo5.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall6 { background:transparent url(../images/squarewall/photo6.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall7 { background:transparent url(../images/squarewall/photo7.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall8 { background:transparent url(../images/squarewall/photo8.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall9 { background:transparent url(../images/squarewall/photo9.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall10 { background:transparent url(../images/squarewall/photo10.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}











#photo_wall11 { background:transparent url(../images/squarewall/photo11.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall12 { background:transparent url(../images/squarewall/photo12.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall13 { background:transparent url(../images/squarewall/photo13.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall14 { background:transparent url(../images/squarewall/photo14.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall15 { background:transparent url(../images/squarewall/photo15.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall16 { background:transparent url(../images/squarewall/photo16.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall17 { background:transparent url(../images/squarewall/photo17.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall18 { background:transparent url(../images/squarewall/photo18.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall19 { background:transparent url(../images/squarewall/photo19.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall20 { background:transparent url(../images/squarewall/photo20.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}






#photo_wall21 { background:transparent url(../images/squarewall/photo21.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall22 { background:transparent url(../images/squarewall/photo22.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall23 { background:transparent url(../images/squarewall/photo23.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall24 { background:transparent url(../images/squarewall/photo24.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall25 { background:transparent url(../images/squarewall/photo25.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall26 { background:transparent url(../images/squarewall/photo26.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall27 { background:#232323 url(../images/squarewall/photo27.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall28 { background:transparent url(../images/squarewall/photo28.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall29 { background:transparent url(../images/squarewall/photo29.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall30 { background:transparent url(../images/squarewall/photo30.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}




#photo_wall31 { background:transparent url(../images/squarewall/photo31.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall32 { background:transparent url(../images/squarewall/photo32.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall33 { background:transparent url(../images/squarewall/photo33.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall34 { background:transparent url(../images/squarewall/photo34.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall35 { background:transparent url(../images/squarewall/photo35.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall36 { background:transparent url(../images/squarewall/photo36.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall37 { background:transparent url(../images/squarewall/photo37.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall38 { background:transparent url(../images/squarewall/photo38.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall39 { background:transparent url(../images/squarewall/photo39.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}
#photo_wall40 { background:transparent url(../images/squarewall/photo40.jpg)no-repeat;
  background-size:auto;transition:10s;
  background-size: 100%;
  background-position: center center;}






#photo_wall41 { background:transparent url(../images/squarewall/photo41.jpg)no-repeat;
  background-size:auto;
  background-size: 100%;
  background-position: center center;}
#photo_wall42 { background:transparent url(../images/squarewall/photo42.jpg)no-repeat;
  background-size:auto;
  background-size: 100%;
  background-position: center center;}
#photo_wall43 { background:transparent url(../images/squarewall/photo43.jpg)no-repeat;
  background-size:auto;
  background-size: 100%;
  background-position: center center;}
#photo_wall44 { background:transparent url(../images/squarewall/photo44.jpg)no-repeat;
  background-size:auto;
  background-size: 100%;
  background-position: center center;}
#photo_wall45 { background:transparent url(../images/squarewall/photo45.jpg)no-repeat;
  background-size:auto;
  background-size: 100%;
  background-position: center center;}
#photo_wall46 { background:transparent url(../images/squarewall/photo46.jpg)no-repeat;
  background-size:auto;
  background-size: 100%;
  background-position: center center;}
#photo_wall47 { background:transparent url(../images/squarewall/photo47.jpg)no-repeat;
  background-size:auto;
  background-size: 100%;
  background-position: center center;}
#photo_wall48 { background:transparent url(../images/squarewall/photo48.jpg)no-repeat;
  background-size:auto;
  background-size: 100%;
  background-position: center center;}
#photo_wall49 { background:transparent url(../images/squarewall/photo49.jpg)no-repeat;
  background-size:auto;
  background-size: 100%;
  background-position: center center;}
#photo_wall50 { background:transparent url(../images/squarewall/photo50.jpg)no-repeat;
  background-size:auto;
  background-size: 100%;
  background-position: center center;}

















/*--TITOLI LETTERE ANIMATE BLAST5 -- */

.spazio { background:transparent;border:0px solid red;height:5vw;width:2vw;float:left;transition: 4s;}
.quadrato {  background: transparent;
  border: 0px solid red;
  height: auto;
  width: auto;
  float: left;
  transition: 4s;
  margin: 0px 0px 0px 0px;
}
.quadrato h1{text-align: center;
  font-size: 89px;
  color: #f26008;
  margin: 0px 0px 0px 0px;
  padding: 40px 0px 0px 0px;
  line-height: 1;
  transition: 1s;
  text-shadow: 0px 0px 20px #090808;}
.quadrato:hover { border: 0px solid red;background:transparent;transition: 400ms;}
.quadrato:hover h1{ border: 0px solid red;background: transparent;transition: 400ms;animation:200ms linear 0s pulse;color:#f9f0a7;margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;line-height:1;}






#esma_music, #esma_info, #esma_social, #esma_contact {
		text-align:right;float:right;
}



.header {
  width: auto;
  height: 8vh;
  padding: 10px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  background: transparent;
  position: fixed;
  z-index: 9;
  overflow: visible;
  transition: 1s;
  float: right;
  right: 0;
}


.header-webtest {
		width:auto;margin:0px 0px 0px 0px;
		background:transparent url(../images/home/homebg3.jpg) no-repeat;
		background-position:center center;
		background-size:cover;
		background-attachment:scroll;
		height:10vh;
}
.center-box {
		border:none;
		margin: 0;
		position: relative;
		top: 50%;
		left: 50%;
		-ms-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
}

.center-sidenav {
	top:50%;
	border:none;
	margin: 0;
	position: relative;
	transform: translate(-50%, -50%);
	padding: 0px 0px 0px 0px;
	width:auto;
	float:right;
}
/*--OVERLAY  -- */

.boxoverlay {
  position:relative;width:100%;
}

.boxoverlay:hover .overlay {
  opacity: 0.5;
}

.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0.9;
  transition: 1.5s ease;
  background-color: #ff0029;
}
.textoverlay {
  color: white;
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}

/*--OVERLAY END  -- */

#Video {
   scrollbar-width: none;
   -ms-overflow-style: none;
   overflow-y: scroll;
   top: 0;
}
#Album {
   scrollbar-width: none;
   -ms-overflow-style: none;
   overflow-y: scroll;
   top: 0;
}
#Testi {
   scrollbar-width: none;
   -ms-overflow-style: none;
   overflow-y: scroll;
   top: 0;
}


/*--SCROLLMENU  -- */

div.scrollmenu {
  background-color: transparent;
  overflow: auto;
  white-space: nowrap;
  text-align:center;
  z-index: 8;
  position: absolute;
  height: auto;
  top: 81vh;
}

div.scrollmenu a {
  display: inline-block;
  color: white;
  text-align: center;
  padding: 14px;
  text-decoration: none;
}
div.scrollmenu a:hover {
  background: #f26008;
  color:#161514;
}

/*--TABS  -- */

/* Style the tab buttons */
.tablink {
  background-color: transparent;
  color: white;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  font-size: 16px;
  width: 20%;float:right;font-weight:bold;
}

/* Change background color of buttons on hover */
.tablink:hover {
  color: #222222;transition:2s;
}
.tablink:active {
  color: #222222;
}
/* Set default styles for tab content */
.tabcontent {
  color: white;
  display: none;
  padding: 0px 0px 0px 0px;
  text-align: right;
  transition:2s;
  opacity:0;
  position:fixed;
  width:100%;

}

/* Style each tab content individually */
#Album {background-color:transparent;}
#Video {background-color:transparent;}
#News {background-color:transparent;}
#Testi {background-color:transparent;}



.hometext  {
	text-align:right;
	line-height:2;
	font-size:12px;
	text-transform:uppercase;
	color: #fff;
	border:10px solid #ff0029;
	padding: 12px 12px;
	margin:0px 0px 0px 0px;
}

.home2text {
	background-color: #ff0029;
	color: #fff;width:60%;
	float:left;margin:0px 20px 10px 0px;
}

.home2text h1{
	background-color: #ff0029;
	font-size: 2em;
	letter-spacing: -2px;
	line-height: 1;
	color: #fff;
	opacity: 0.4;
	padding: 60px 50px 120px 50px;
	text-align: left;
	margin: 0px auto;
}

.boxscroll {
 overflow-y:scroll;
}


.boxscroll::-webkit-scrollbar {
  display: none;
}
.boxscroll {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}


.orizontal_scroll{
	overflow-x: scroll;
	overflow-y: hidden;
	height: 80px;
  	white-space:nowrap
}

/* SOTTOTITOLO dX */
.box_titlepagedx {
		width:auto;
		margin:0px auto;
		float:right;
		background: #ff0029cf;
		transition: 1.5s;
		float:right;
}

.box_titlepagedx h2, .box_titlepagedx h2 a {
   cursor:pointer;
   text-transform:uppercase;
   opacity:0.6;
        padding:25px 40px 10px 40px;
	line-height:1;
	font-size:31px;
	text-align:right;
	color:#fff3b7;
   line-height:1;
   transition: 1.5s;
}
.box_titlepagedx a:hover h2{
     color: #fff;
     font-size:31px;
        padding: 100px 40px 10px 40px;
     opacity:1;
     transition: 1.5s;
     margin:0px 0px 0px 0px;
}


/* SOTTOTITOLOdx END */

/* SOTTOTITOLO SX */
.box_titlepagesx {
		width:auto;
		margin:0px auto;
		float:right;
		background: #ff0029cf;
		transition: 1.5s;
		float:right;
}

.box_titlepagesx h2, .box_titlepagesx h2 a {
   cursor:pointer;
   text-transform:uppercase;
   opacity:0.6;
        padding:25px 40px 10px 40px;
	line-height:1;
	font-size:31px;
	text-align:right;
	color:#fff3b7;
   line-height:1;
   transition: 1.5s;
}
.box_titlepagesx a:hover h2{
     color: #fff;
     font-size:31px;
        padding: 10px 140px 10px 40px;
     opacity:1;
     transition: 1.5s;
     margin:0px 0px 0px 0px;
}


/* SOTTOTITOLOsx END */
/* SOTTOTITOLO */
.box_titlepage {
		width:auto;
		margin:0px auto;
		float:right;
		background: #ff0029cf;

}

.box_titlepage h2, .box_titlepage h2 a {
   cursor:pointer;
   text-transform:uppercase;
   opacity:0.6;
        padding:10px 40px 20px 40px;
	line-height:1;
	font-size:31px;
	text-align:right;
	color:#fff3b7;
   line-height:1;
   transition: 1.5s;
}
.box_titlepage a:hover h2{
     color: #fff;
     font-size:31px;
        padding: 10px 240px 20px 40px;
     opacity:1;
     transition: 1.5s;
     margin:0px 0px 0px 0px;	font-size:36px;
}


/* SOTTOTITOLO END */



/* PULSANTE X CHIUSURA OPENCITY */
.xbtn {
		height: 100%;
		width: 50px;
		position: relative;
		z-index: 7;
		transition: 1.5s;
		text-align: right;
		float: right;
}


.xbtn a {
    text-decoration: none;
    font-size: 5em;
    text-transform:uppercase;
    letter-spacing:-1px;
    font-weight:bold;
    color: #ffffff;
    display: block;
    transition: 0.3s;
    text-align:right;
    line-height:1; cursor:pointer;
}
/* When you mouse over the navigation links, change their color */
.xbtn a:hover {
     color: #292929; cursor:pointer;
     font-size:3.5em; padding: 0px 10px;
}
/* Position and style the close button (top right corner) */
.xbtn .closebtn {
    position: absolute;
    top: 0; right: 0;
    font-size: 36px;
    padding: 10px 10px; cursor:pointer;
}





/* PULSANTE X SOTTOTITOLO  */

 .close {
    height: 64vh; /* 100% Full-height */
    width: 0px; /* 0 width - change this with JavaScript */
    position: fixed; /* Stay in place */
    z-index: 5; /* Stay on top */
    left: 0;
    text-align:right;
    background: #bb0000;
    color: #292929;
    overflow-x: hidden; /* Disable horizontal scroll */
    padding: 0px 0px 0px 0px;
    transition: 1.5s;
    border-right:0px solid #ff0029;

}


/* The navigation menu links */
.close a {
    text-decoration: none;
    font-size: 5em;
    text-transform:uppercase;
    letter-spacing:-1px;
    font-weight:bold;
    color: #ffffff;
    display: block;
    transition: 0.3s;
    text-align:right;
    line-height:1;
}
/* When you mouse over the navigation links, change their color */
.close a:hover {
     color: #292929;
     font-size:4.7em;
}
/* Position and style the close button (top right corner) */
.close .closebtn {
    position: absolute;
    top: 0;z-index:9;background:#bb0000;right:0;
    font-size: 36px;padding: 10px 10px;
}
/*-----------------------------------------------------------------------------------*/
/*	BOX TAB LEFT */
/*-----------------------------------------------------------------------------------*/

#tableft-btn {
  margin: 20px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  border: 1px solid #f26008;
}
#tableft-btn-mobile {
  width: 100%;
  margin: 0px 0px 20px 0px;
  padding: 10px 0px 20px 0px;
  position: relative;
  float: left;
  z-index: 2;
  background: transparent;
}
#tableft-btn a {
	font-size: 1vw;
	font-weight: bold;
	text-align: right;
padding: 1vh 1vh;
color: #f26008;
	position: relative;
  cursor:pointer;
  z-index:2;
float: left;
  width: 100%;
transition:1.5s;
}
#tableft-btn-mobile a {
	font-size: 8vw;
  line-height:1;
	font-weight: bold;
	text-align: center;
padding: 1vh 1vh;
color: #f26008;
	position: relative;
  cursor:pointer;
  z-index:2;
float: left;
  width: 100%;
transition:1.5s;
}

#tableft-btn a:hover, #tableft-btn-mobile a:hover {
color: #fff;
text-shadow: 1px 0px 4px #EEECE3F2, 2px 1px 3px #FFD5FF, 2px 0px 2px #5c556a, 2px 0px 55px, 5px 0px 100px, 20px 0px 200px #D42C2C,40px 0px 200px #D42CCA;
}


 .boxTabLeft {
  position: fixed;
  z-index: 9;
  left: 0;
  text-align: right;
  color: #292929;
  overflow-x: hidden;
  padding: 0px 0px 0px 0px;
  transition: 1.1s cubic-bezier(.48,.03,.68,.98);
  border-right: 2px solid #ff6c00;
  top: 0px;
  height: 100%;
  background: #161514;
  width: 0%;
}


/* The navigation menu links */
.boxTabLeft a {
    text-decoration: none;
    font-size: 5em;
    text-transform:uppercase;
    letter-spacing:-1px;
    font-weight:bold;
    color: #ffffff;
    display: block;
    transition: 0.3s;
    text-align:right;
    line-height:1;
}
/* When you mouse over the navigation links, change their color */
.boxTabLeft a:hover {
     color: #292929;
     font-size:4.7em;
}
/* Position and style the close button (top right corner) */
.boxTabLeft .closebtn {
    position: absolute;
    top: 0;z-index:9;background:transparent;right:0;
    font-size: 36px;padding: 10px 10px;
}

/*-----------------------------------------------------------------------------------*/
/*	BOX TAB RIGHT */
/*-----------------------------------------------------------------------------------*/


.boxTabRight {
    height: 64vh;
    width: 0;
    position: fixed;
    z-index: 7;
    right: 0;
    text-align:right;
    background: #bb0000;
    background-repeat: no-repeat ;
    background-position: top left;
    background-attachment: fixed;
    background-size: 50%;
    color: #292929;
    overflow-x: hidden; /* Disable horizontal scroll */
    padding: 0px 0px 0px 0px;
    transition: 1.5s; /* 0.5 second transition effect to slide in the sidenav */
    border-right:0px solid #bb0000;
}
.boxTabRight a {
    text-decoration: none;
    font-size: 2em;
    text-transform:uppercase;
    letter-spacing:-1px;
    font-weight:bold;
    color: #ffffff;
    display: block;
    transition: 0.3s;
    text-align:right;
    line-height:1;
}
.boxTabRight a:hover {
     color: #292929;
     font-size:4.7em;
}
.boxTabRight .closebtn {
    position: absolute;
    top: 0;z-index:9;background:#bb0000;left:0;
    font-size: 36px;padding: 10px 10px;
}






/*-- INIZIO OLD CODE  -- */





/*-----------------------------------------------------------------------------------*/
/*	MENU TOP NAV */
/*-----------------------------------------------------------------------------------*/
.burger1{
    font-size:1em;
    cursor:pointer;
    background-color: transparent;
    color: #600909;
    z-index:2;
    font-weight: bold;
    line-height: 1;
    z-index:999999999;
}

.burger2{
    font-size:30px;
    cursor:pointer;
    background-color: transparent;
    color: white;
    z-index:2;
    padding: 10px 10px 10px 10px;
    font-weight: bold;
    line-height: 1;
    z-index:999999999;
}

/* Add a black background color to the top navigation */
.top {
  background-color: transparent;
  float: left;
  position: fixed;
  z-index: 3;
  width: auto;
  padding:20px 0px 0px 10px;

}
 .top a {
    float: none;
    display: inline-block;
    color: #f2f2f2;
    text-align: center;
    padding: 24px 16px;
    text-decoration: none;
    font-size: 17px;
}
.top a:hover {color: black;}
 .burgerdesktop {
    display: inline !important;
   }
   .burgermobile {
    display: none !important;
   }


.topnav { background-color: transparent;
			text-align:left;
			padding: 0px 0px 0px 0px;
			height: auto;
			overflow: hidden;
			float:right;}
/* Style the links inside the navigation bar */



  .topnav p {
     /* animation-name:slideInUp;
		animation-duration: 1.9s;
		animation-delay: 0s;
		animation-iteration-count: infinite;
		animation-timing-function: linear;
		animation-direction: alternate; */
		color:#f26008;
		margin:0px 0px;
font-size:16px;
font-weight:bold;
cursor:pointer;
transition:1.5s;
padding:4vh 4vh 4vh 4vh;
  }
  .topnav:hover p {color:#fff;}
.topnav a {
float: none;
  display: inline-block;
  color: #f2f2f2;
  text-align: center;
  padding: 0px 0px;
  text-decoration: none;
  font-size: 16px;
  transition: 1.5s;
  background: transparent;
  height: auto;
  margin: 0px 0px;

}
/* Change the color of links on hover */
.topnav a:hover {
    color: #f26008;
}
/* Add an active class to highlight the current page */
.active {
    background-color: transparent;
    color: #ff5f55;
}
/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
    display: none;border: 2vw solid #161514;
}

.responsive {width:100%;height:auto;
             transition:1.5s;padding:20px 0px 0px 0px;
}

 /* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home").
 Show the link that contains should open and close the topnav (.icon) */
@media screen and (max-width: 600px) {


	.topnav  {min-height:30px;transition: 1.5s;height: 0px;padding: 0px 0px 0px 0px;float:left;}

	.topnav a {height:0px;}
	.topnav a:not(:first-child) {display: none;}

	.topnav a.icon {
    float: left;width: 14vw;
    display: block;height:auto;
  }
}
/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon.
This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 600px) {


  .topnav.responsive {
position: relative;
    background: #161514;
    min-height: 100vh;
    opacity: 1;
    display: block;
    transition: 1.5s;
    padding: 0px 40px 0px 40px;
  }

  .topnav.responsive a.icon {
    position: fixed;
    left: 0;
    top: 0;
  }
  .topnav.responsive a {
	float: none;
	display: inline-block;
	text-align: center;
	transition:1.5s;
	height:auto;
  }
}



/*-----------------------------------------------------------------------------------*/
/*	PULSANTE BURGER X TOP NAV */
/*-----------------------------------------------------------------------------------*/

  /* Styling the menu button */
        .menu-btn {
            position: absolute;
            z-index: 3;
            right: 35px;
            top: 35px;
            cursor: pointer;
            transition: all 0.5s ease-out;
        }
        /* Styling the hamburger lines */
        .menu-btn .btn-line {
            width: 28px;
            height: 3px;
            margin: 0 0 5px 0;
            background: black;
            transition: all 0.5s ease-out;
        }
        /* Adding transform to the X */
        .menu-btn.close {
            transform: rotate(180deg);
        }
        /* Styling the three lines to make it an X */
        .menu-btn.close .btn-line:nth-child(1) {
            transform: rotate(45deg) translate(5px, 5px);
        }
        .menu-btn.close .btn-line:nth-child(2) {
            opacity: 0;
        }
        .menu-btn.close .btn-line:nth-child(3) {
            transform: rotate(-45deg) translate(7px, -6px);
        }
        /* Styling the position of the menu icon */
        .menu {
            position: fixed;
            top: 0;
            width: 100%;
            opacity: 0.9;
            visibility: hidden;
        }
        .menu.show {
            visibility: visible;
        }
        /* Adding a transition delay
          to the 4 items in the
          navigation menu */
        .nav-item:nth-child(1) {
            transition-delay: 0.1s;
        }
        .nav-item:nth-child(2) {
            transition-delay: 0.2s;
        }
        .nav-item:nth-child(3) {
            transition-delay: 0.3s;
        }
        .nav-item:nth-child(4) {
            transition-delay: 0.4s;
        }


/*-----------------------------------------------------------------------------------*/
/*	FIGURE BACKGROUND
/*-----------------------------------------------------------------------------------*/
.crosscont {
	z-index: -1;
	margin: 0px auto;
	position:fixed;
	padding:0px auto;
	height:100vh;
}
.crossfade > figure {
  animation: imageAnimation 12s linear infinite 0s;
  backface-visibility: hidden;
  background-position: center center;
  color: transparent;
  height: 100vh;
  left: 0px;
  opacity: 0;
  position: fixed;
  top: 0px;
  width: 100%;
  z-index: 0;
  margin: 0 auto;
}
.crossfade > figure:nth-child(1) {
  background: transparent url(../images/bg/1.jpg) no-repeat;
  background-size: cover;
  background-position: center top;
}
.crossfade > figure:nth-child(2) {
  animation-delay: 6s;
  background: transparent url(../images/bg/2.jpg) no-repeat;
  background-size: cover;
  background-position: center top;
}
.crossfade > figure:nth-child(3) {
  animation-delay: 12s;
  background: transparent url(../images/bg/3.jpg) no-repeat;
  background-size: cover;
  background-position: center top;
}

@keyframes
imageAnimation {
 0% {
 animation-timing-function: linear;
 opacity: 0;
}
 25% {
 animation-timing-function: linear;
 opacity: 0.5;
}
 50% {
 opacity: 1;
}
 75% {
 opacity: 0.5;
}
 100% {
 opacity: 0;
}
}

/*-----------------------------------------------------------------------------------*/
/*	RESET */
/*-----------------------------------------------------------------------------------*/
html, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, acronym, address, big, cite, code, del, dfn, em, font, img, ins,
kbd, q, s, samp, small, strike, strong, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}
body {
   height:100%;
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
}
ol, ul {
	list-style:none
}
blockquote, q {
	quotes:none
}
blockquote:before, blockquote:after, q:before, q:after {
	content:'';
	content:none
}
:focus {
	outline:0
}
ins {
	text-decoration:none; }
del {
	text-decoration:line-through;
}
table {
	border-collapse:collapse;
	border-spacing:0
}
.clear {
	clear:both;
	display:block;
	overflow:hidden;
	visibility:hidden;
	width:0;
	height:0
}
.clearfix:after {
	clear:both;
	display:block;
	font-size:0;
	line-height:0;
	visibility:hidden;
	width:0;
	height:0;
}
.clearfix {
	display:inline-block;
}
* html .clearfix {
	height:1%;
}
.clearfix {
	display:block;
}
th, td {
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
.clear {
	clear: both;
}
br {
	line-height: 10px;
}
input[type="submit"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner {
 border : 0px;
}
input[type="submit"]:focus, input[type="button"]:focus {
	outline : none;
}

/*-----------------------------------------------------------------------------------*/
/*	SEZIONI SITO */
/*-----------------------------------------------------------------------------------*/


.glasscontainer:before {
  content: "";
  position: absolute;
  background: inherit;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  box-shadow: inset 0 0 2000px rgba(255, 255, 255, 0.5);
  filter: blur(3px);
  margin: -20px;
}
.glasscontainer {
  width: 100%;
  height: auto;
  box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.2);
  border-radius: 0px;
  position: relative;
  z-index: 1;
  background: inherit;
  overflow: hidden;padding:0px 50px 0px 50px;
}



.testglass {
   background: transparent url(../images/bg/glass1.png) no-repeat;
/* Keep the inherited background full size. */
background-attachment: fixed;
background-size: cover;
width:80%;margin:0px auto;
 box-shadow: 0px 0px 40px 3px rgba(0, 0, 0, 1);
}


.wrapper {
    max-width: 100%;
    margin: 0 auto;
    z-index:9999999999999999;
    border: 3px solid white;
}
.header-wrapper {
    background: rgba(0, 0, 0, 0.33);
    margin-bottom: 40px;
    -webkit-box-shadow: 0 1px 0 rgba(0,0,0,0.55), inset 0 -1px 0 rgba(255,255,255,0.09);
    -moz-box-shadow: 0 1px 0 rgba(0,0,0,0.55), inset 0 -1px 0 rgba(255,255,255,0.09);
    box-shadow: 0 1px 0 rgba(0,0,0,0.55), inset 0 -1px 0 rgba(255,255,255,0.09);
    position: relative;
    z-index: 101;
}
.logo {
    float: left;
    padding-top: 22px;
}
.intro {
    font-size: 22px;
    line-height: 30px;
    margin: 10px 10px 10px 10px;
    text-align: center;
    color: #000;
    font-weight: 300;
    font-style: italic;
    border: 0px solid black;
}
/*-----------------------------------------------------------------------------------*/
/*	GENERAL */
/*-----------------------------------------------------------------------------------*/
.scanlines {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: -1;
    background: url(../images/tile.png);
}
body {
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
    font-family: 'Tahoma', sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 21px;
    letter-spacing: 0.2px;
    color: #b9b9b9;
    background: #bb0000;
}
p {
    margin-bottom: 20px
}
a {
    color: #ff5f55;
    text-decoration: none;
    transition: all 200ms ease-in;
    -webkit-transition: all 200ms ease-in;
    -o-transition: all 200ms ease-in;
    -moz-transition: all 200ms ease-in;
}
a:hover {
    color: #ffffff;
}

a.button.blue {
    background-color: #5f9cb8;
    color: #2d444e;
}
a.button.pink {
    background-color: #b55fb8;
    color: #443144;
}
a.button.purple {
    background-color: #635fb8;
    color: #313045;
}
a.button.yellow {
    background-color: #ac9757;
    color: #433f32;
}
a.button.red {
    background-color: #ac5757;
    color: #4a3232;
}
a.button.green {
    background-color: #5ca980;
    color: #2b4638;
}

h2,h3,h4,h5,h6 {
    font-family: 'Tahoma', sans-serif;
    color: #000000;
    margin-bottom: 20px;
}

h1 {
    font-size: 80px;
    line-height: 1;font-family: 'Tahoma', sans-serif;
}
h2 {
    font-size: 22px;
    line-height: 24px;
}
h3 {
    font-size: 20px;
    line-height: 22px;
}
h4 {
    font-size: 18px;
    line-height: 20px;
}
h5 {
    font-size: 16px;
    line-height: 20px;
    margin-bottom: 10px;
}
h6 {
    font-size: 14px;
    line-height: 18px;
}
h2.title {
    font-size: 15px;
    letter-spacing: 0.4px;
    line-height: 21px;
    margin-bottom: 10px;
}
h1.title a,
h2.title a {
    color: #dedede
}
.title a:hover {
    color: #86aca3
}
ul {
    margin-bottom: 0px;
    list-style-type: disclosure-closed;
    list-style-position: inside;
    padding: 20px 0px;
}
ul li {
    padding: 35px 0px 0px 100px;
    margin: 0;
    font-weight: bold;
    text-transform: uppercase;
	 color: #f26008;
    text-align:left;
    height:100px;
}
ol {
    list-style: decimal;
    list-style-position: inside;
    margin-bottom: 20px;
}
ol li {
    padding: 0;
    margin: 0;
}
hr {
    border: none;
    background: transparent url(../images/line.png) repeat-x;
    height: 3px;
    margin-top: 8px;
    margin-bottom: 0px;opacity:0.8;width:28%;float:left;
}

/*-----------------------------------------------------------------------------------*/
/*	SPAN LINKS*/
/*-----------------------------------------------------------------------------------*/
.alignleft {
    float: left;
    display: block;
    margin-right: 20px;
}
.alignright {
    float: right;
    display: block;
    margin-left: 20px;
}
.aligncenter {
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.dropcap {
    display: block;
    float: left;
    font-size: 45px;
    padding: 0;
    margin: 0;
    margin: 10px 8px 0 0;
    text-transform: uppercase;
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: bold;
}

.lite1 {
    color: #ff0029;
    font-size:30px;
}
.lite2 {
    color: #ff0029;
    font-size:20px;
}
.litebio {
    color: #ffffff;
    font-size:20px;
}
.lite3 {
    color: #F1F180;
    border-bottom: 0px solid #c80000;
    font-size: 20px;
    text-decoration:none;
}
.lite3.a{
    color: #c80000;
    border-bottom: 0px solid #c80000;
    font-size: 20px;
}

.lite3.a:hover{
    color: #F1F180;
    border-bottom: 0px solid #c80000;
    font-size: 20px;
}
.lite4 {
    color: #f26008;
    border-bottom: 0px solid #c80000;
    font-size: 18px;
    text-decoration:none;
    font-weight:bold;
    line-height: 110%;

}
.lite4.a{
    color: #c80000;
    border-bottom: 0px solid #c80000;
    font-size: 25px;
}
.lite4.a:hover{
    color: #c80000;
    border-bottom: 0px solid #c80000;
    font-size: 25px;
}
.lite5 {
    color: #f26008;
    font-family: sans;
    text-decoration:none;
    text-align: center;
   line-height: 1;
   font-size:9px;font-weight:bold;
text-transform:uppercase;

}
.lite5.a{
    color: #c80000;
    border-bottom: 0px solid #c80000;

}

.lite5.a:hover{
    color: #c80000;
    border-bottom: 1px solid #c80000;

}

.lite6 {
    color: #ffffff;text-shadow: 1px 1px 2px black, 0 0 1em blue, 0 0 0.2em red;
    font-size: 32px;
    font-family: 'tahome', sans;
    text-decoration:none;
    text-align: center;
}

.lite7 {
    color: #ffffff;text-shadow: 1px 1px 2px black;
    font-size: 32px;
    font-family: 'manbow', tahoma, sans;
    text-decoration:none;
    text-align: center;
}
.lite8 {
color: #ff0029;
font-size: 1.8em;line-height: 77%;
}

/*-----------------------------------------------------------------------------------*/
/*	COLONNE
/*-----------------------------------------------------------------------------------*/
.one-half {
    width: 50%
}
.one-third {
    width: 33.3%
}
.two-third {
    width: 66%
}
.one-fourth {
    width: 25%
}
.three-fourth {
    width: 75%
}
.one-fifth {
    width: 20%
}
.two-fifth {
    width: 40%
}
.three-fifth {
    width: 60%
}
.four-fifth {
    width: 80%
}
.one-sixth {
    width: 16.65%
}
.five-sixth {
    width: 83.25%
}
.one-half,
.one-third,
.two-third,
.three-fourth,
.one-fourth,
.one-fifth,
.two-fifth,
.three-fifth,
.four-fifth,
.one-sixth,
.five-sixth {
    position: relative;
    margin-right: 0px;
    float: left;
}
.last {
    margin-right: 0 !important;
    clear: right;float:right;
}

.lastvideo {
    margin-right: 0 !important;
    clear: right;
}
.column-wrapper {
    overflow: hidden;
    width: 100%;
}
/*-----------------------------------------------------------------------------------*/
/*	BLOG GRID
/*-----------------------------------------------------------------------------------*/
.blog-grid.masonry {
    overflow: inherit !important;
}
.boxnull {
    margin: 0px 0px;
    background: transparent;
    padding: 0px;
    position: relative;
    overflow: hidden;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
}
.box {
    margin: 0 0 30px 0;
    background: rgba(0, 0, 0, 0.44);
    -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.44);
    box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.44);
    padding: 20px;
    padding-bottom: 0;
    position: relative;
    overflow: hidden;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
}
.frame {
    display: block;
    position: relative;
    pointer-events: none;
}
img {
    display: block;
    max-width: 100%;
}
iframe {
    display: block;
    pointer-events: auto;
}
blockquote {
    margin: 0 0 20px 0;
    font-size: 16px;
    line-height: 25px;
    font-weight: 300;
    background-image: url(../images/quote.png);
    background-repeat: no-repeat;
    background-position: right top;
    font-style: italic;
}
/*-----------------------------------------------------------------------------------*/
/*	FORMS
/*-----------------------------------------------------------------------------------*/

.open-formsquare {
width: 19vw !important;
  height: 73vh !important;
  left: 0vh !important;
  box-shadow: 0px 0px 50px 10px #000 inset !important;
  bottom: 11vh !important;
  border-radius: 0px !important;
}
#form-square {
  width: 16vh;
  height: 16vh;
  left: 34%;
  bottom: 10vh;
  margin: 0;
  padding: 1vh 1vh;
  position: absolute;
  background: #161514;
  background-repeat:no-repeat;
  background-size: contain;
  background-position: center center;
  transition: 1s;
  overflow: hidden;
  box-shadow: 0px 0px 0px 0px #000 inset;
  border-radius: 2vw;
  border: 2px solid red;
  z-index: 8;
}

.lite-contacts {
  color: #9f956d;
  font-weight: bold;
  font-size: 25px;
  padding: 6vh 0vh 0vh 1vh;
  position: absolute;
}

#mailme {
  height: auto;
  width: 220px;
  margin: 0px 0px;
  overflow: hidden;
  position: absolute;
  float: right;
  right: 0;
}
#mailbox {
  height: 100%;
  width: 70%;
  margin: 0vh 0vh;
  overflow: visible;
  float: right;
  padding: 1vh;
}
#mail_credenzialibox {
  height: auto;
  width: 100%;
  margin: 0px 0px 0px 0px;
  position: relative;
  top: 21vh;
  }
.box-email {
  width: 100%;
  height:  100%;
  margin: 0px auto;
  padding: 5vh 5vh 0vh 0vh;
  position: relative;
  background: transparent;
  transition: 1s;
  overflow: visible;
  text-align: left;
}
.box-email h3{
  font-size: 14px;
  line-height: 110%;
  font-family: 'Tahoma', sans-serif;
  color: #ff7800;
  margin: 0px auto;
  padding: 0px 10px 0px 10px;
  text-align: right;
}
.box-email h5{
  font-size: 8px;
  line-height: 11px;
  font-family: 'Tahoma', sans-serif;
  color: #cec0bc;
  margin: 0px 0px 0px 0px;
  text-transform: uppercase;
  font-weight: 300;
  padding: 0% 0% 0% 8%;
  text-align: right;
  position: absolute;
  bottom: 1vh;
  right: 1vh;
}
.box-email a:hover h3  { color:#fff; }
#personal-info {
  background: #161514;
  border: 2px solid #f26008;
  position: relative;
  float: right;
  bottom: 0;
  overflow: hidden;
  border-radius: 12px 0px 0px 12px;
  border-right: none;
  height: 100%;
  width: 100%;
  padding: 50px 0px 50px 0px;
  margin: 50px 0px 0px 0px;



}
#personal-info p {
text-align: right;
  padding: 0px 20px 0px 10px;
  text-transform: uppercase;
  font-size: 10px;
  line-height: 153%;
  color: #fff;
  margin: 0px 0px 0px 0px;
  position: relative;
}


.textbio {
padding: 0px 0px 0px 0px;
  overflow: hidden;
  border: 0px solid #1c1818;
  background: #161514 url(../images/spinner_orange.jpg);
  background-repeat: repeat;
  background-size: contain;
  background-position: center center;
  width: 200px;
  margin: 0px auto;
  border: 2px solid #f26008;
  border-radius: 100% 100%;
  min-height: 200px;

}


.textbio p{
text-align: left;
  padding: 0px 0px 0px 10px;
  text-transform: uppercase;
  font-size: 10px;
  line-height: 153%;
  color: #fff;
  margin: 0px 0px 0px 0px;
}

.textbio h3{
text-align: center;
  font-size: 3em;
  line-height: 85%;
  color: #ff7800;
  background: transparent;
  padding: 0px 0px 0px 0px;
  margin: 0px auto;
  text-transform: uppercase;
  transition: 1s ease;
  width: auto;
  float: left;
  height: auto;
  position: relative;
  clear: both;
}



.textbio h5{
  text-align: justify;
  padding: 0px 0px 0px 10px;
  text-transform: uppercase;
  font-size: 7px;
  line-height: 1.6;
  color:#fff;
}

textarea {
background: #161514;
  border: 2px solid #f26008;
  border-radius: 12px 12px 0px 0px;
  color: #bdb0b0;
  font-family: sans;
  font-size: 1.2em;
  line-height: 21px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
}
input {
background: #161514;
  border: none;
  color: #fff;
  font-family: 'Open Sans', sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 21px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
}
textarea:focus {
    opacity:1;
    color: #161514;
    background:#f26008;
    border-radius: 12px 12px 0px 0px;
}
input:focus {
    opacity:1;
    color: #161514;
    background:#f26008;
border-radius: 12px 0px 0px 12px;
}
.form-control {
  box-shadow: none;
  background: transparent;
  border: 2px solid rgba(0, 0, 0, 0.1);
  height: 54px;
  font-size: 18px;
  font-weight: 300;
}
.form-control:active, .form-control:focus {
  outline: none;
  box-shadow: none;
  border-color: #3333ff;
}
a.more {
    margin-bottom: 20px;
    display: inline-block;
    line-height: 1;
}
a.button,
.forms fieldset .btn-submit,
#commentform input #submit {
  background: #1615148c;
  height: 60px;
  color: #b9aeae;
  font-size: 2em;
  padding: 0px 0px 0px 0px;
  display: inline-block;
  transition: all 200ms ease-in;
  -webkit-transition: all 200ms ease-in;
  -o-transition: all 200ms ease-in;
  -moz-transition: all 200ms ease-in;
  cursor: pointer;
  margin: 0px auto;
  width: 100%;
  border: 2px solid #f26008;
  font-weight: bold;
  text-align: center;
border-radius: 0px 0px 12px 0px;
}
a.button,
.forms fieldset .btn-submit:hover {
    background: #f26008;
    color: #161514;
}
a.button,
.forms fieldset .btn-submit:focus {
    background: #f26008;
}
.forms {
    position: relative;
    padding: 0;
    width: 100%;
}
.form-container .response {
    color: #58a267;
    display: none;
    margin: 0 0 15px 0;
}
.forms ol {
    margin: 0;
    padding: 0;
}
.forms ol li {
    line-height: 1px;
    list-style: none;
}
.forms li.form-row-personal {
  margin: 37px 0px;
  width: 100%;
  border-radius: 12px;
  padding: 0px 0px 0px 40px;
}
.forms li.form-row1 {
margin: 0px 0px;
  width: 100%;
  border-bottom:2px solid #f26008;
  border-radius: 0px;
  padding: 0px 0px 0px 0px;
  position: relative;
}
.forms li.form-row2 {
  margin: 0px 0px;
  width: 100%;
  border-bottom:2px solid #f26008;
  border-radius: 0px;
  padding: 0px 0px 0px 0px;
}
.forms li.form-row3 {
  margin: 0px 0px;
  width: 100%;
  border-bottom:2px solid #f26008;
  border-radius: 0px;
  padding: 0px 0px 0px 0px;
}
.forms li.form-row4 {
  margin: 0px 0px 0px 0px;
  width: 100%;
  border-radius: 12px 12px 0px 0px;
  padding: 0px 0px 0px 0px;


}
.forms li.button-row {
  margin: 0px 0px 10px 0px;
  width: 100%;
  border-radius: 0px 0px 12px 12px;
  padding: 0px 40px 0px 0px;
}
.forms li.hidden-row {
    display: none
}
.forms fieldset .text-input,
#commentform input {
padding: 0px 0px 0px 80px;
    height: 45px;
}
.forms fieldset .text-area,
#commentform textarea {
  min-height: 51vh;
    padding: 40px 20px 0px 20px;
}
.forms li.error input,
.forms li.error textarea {
    border: 1px solid #6a3333
}
.forms span.error {
    display: none
}
.forms .button-row span.error {
    padding: 0;
    display: none;
}
.forms label {
  display: block;
  margin-bottom: -1px;
  padding: 23px 10px;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: -1px;
  position: absolute;
  z-index: 9;
  color: #404040;
}
#commentform label {
    display: inline-block;
    margin-bottom: 5px;
}
.form-container:after {
    content: '';
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.searchform input {
    padding: 8px 10px;
    margin-bottom: 20px;
}
.form-allowed-tags {
    display: none
}
.forms br {
    display: none
}



/*-----------------------------------------------------------------------------------*/
/*	SOCIAL
/*-----------------------------------------------------------------------------------*/
.social {
    margin-top: 20px;
    text-align: center;
    background-color: transparent;
}
#footer .social {
    margin: 0;
    text-align: left;
}
.social li {
    display: inline;
    margin: 0 2px;
}
.social a {
    background: transparent url(../images/social-icons.png) no-repeat 0 0;
    height: 32px;
    width: 32px;
    display: inline-block;
    position: relative;
    transition: all 200ms ease-in;
    -webkit-transition: none 200ms ease-in;
    -o-transition: none 200ms ease-in;
    -moz-transition: none 200ms ease-in;
}
.social a.deezer {
    background-position: 0 0
}
.social a.facebook {
    background-position: -32px 0
}
.social .twitter {
    background-position: -64px 0
}
.social .soundcloud {
    background-position: -96px 0
}
.social .pinterest {
    background-position: -128px 0
}
.social .flickr {
    background-position: -160px 0
}
.social .amazon {
    background-position: -192px 0
}
.social .vimeo {
    background-position: -224px 0
}
.social .instagram {
    background-position: -256px 0
}
.social .thumblr {
    background-position: -288px 0
}
.social .itunes {
    background-position: -320px 0
}
.social .skype {
    background-position: -352px 0
}
.social .musicreiser {
    background-position: -384px 0
}
.social .tidal {
    background-position: -416px 0
}
.social .google {
    background-position: -448px 0
}

.social .thezoo {
    background-position: -480px 0
}

.social .youtube {
    background-position: -512px 0
}

.social .web {
    background-position: -544px 0
}


.social .spotify {
    background-position: -576px 0
}
.social .flash {
    background-position: -608px 0
}
/*-----------------------------------------------------------------------------------*/
/*	social hover*/
/*-----------------------------------------------------------------------------------*/
.social a.deezer:hover {
    background-position: 0 bottom
}
.social .facebook:hover {
    background-position: -32px bottom
}
.social .twitter:hover {
    background-position: -64px bottom
}
.social .soundcloud:hover {
    background-position: -96px bottom
}
.social .pinterest:hover {
    background-position: -128px bottom
}
.social .flickr:hover {
    background-position: -160px bottom
}
.social .amazon:hover {
    background-position: -192px bottom
}
.social .vimeo:hover {
    background-position: -224px bottom
}
.social .instagram:hover {
    background-position: -256px bottom
}
.social .tumblr:hover {
    background-position: -288px bottom
}
.social .itunes:hover {
    background-position: -320px bottom
}
.social .skype:hover {
    background-position: -352px bottom
}
.social .musicreiser:hover {
    background-position: -384px bottom
}
.social .tidal:hover {
    background-position: -416px bottom
}
.social .google:hover {
    background-position: -448px bottom
}
.social .thezoo:hover {
    background-position: -480px bottom
}

.social .youtube:hover {
    background-position: -512px bottom
}
.social .web:hover {
    background-position: -544px bottom
}


.social .spotify:hover {
    background-position: -576px bottom
}

.social .flash:hover {
    background-position: -608px bottom
}



/*-----------------------------------------------------------------------------------*/
/*	FOOTER
/*-----------------------------------------------------------------------------------*/

.footer-wrapper {
    background: transparent url(../images/follow/neurocollage2.png);
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: cover;
    background-attachment:fixed;
    margin-top: 60px;
    -webkit-box-shadow: 0 -1px 0 rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.09);
    -moz-box-shadow: 0 -1px 0 rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.09);
    box-shadow: 0 -1px 0 rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.09);
}
#footer {
    width: 1010px;
    margin: 0 auto;
    padding: 25px 0;
    overflow: hidden;
}
#footer h3 {
    font-size: 15px;
    margin-bottom: 15px;
}
#footer a,
.site-generator a {
    color: #b9b9b9
}
#footer a:hover,
.site-generator a:hover,
#footer {
    color: #86aca3
}
#footer ul li {
    list-style: none
}
.site-generator-wrapper {
    background: transparent; padding:20px 0;
    line-height:1;
}
.site-generator {
    width: 1010px;
    margin: 0 auto;
    padding: 20px 0;
}
.site-generator p {
    padding: 0
}
/*-----------------------------------------------------------------------------------*/
/*	PERSONAL
/*-----------------------------------------------------------------------------------*/
.mainhomenews {
    position:relative;
    z-index:6;
    border:1px solid #ffffff;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 100%; height:auto;
    overflow: hidden;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
    background: transparent;
}
.textcontact {
    padding: 20px 20px 20px 20px;
    color: #000000;
    position: relative;
    width: 100%;
    overflow: hidden;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
    background-color: transparent;
}
.bordocookie {
    padding: 20px 20px 20px 20px;
    color: #000000;
    position: relative;
    width: 100%;
    overflow: hidden;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
    background-color: #ffffff;
}
#boxinfo {
    margin: 0 auto;
    position: relative;
    width: 100%; min-height:450px;
    overflow: hidden;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
    color: #ffffff;
    background: transparent;
}
.bghome2 {
    margin: 0px 0px 0px 0px;
    position: relative;
    width: 100%;
    overflow: hidden;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
    background-color :#212121;
}
.orgmenu {
    margin: 0px 0px 0px 0px;
    padding: 30px 30px 30px 30px;
    height:auto;
    position: relative;
    width: 100%;
    overflow: hidden;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
}
.whatsapp {
    margin: 0px 0px 0px 0px;
    padding: 0px;
    position: relative;
    width: 50px;  height:50px;
    overflow: hidden;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
    background: transparent url(../images/wtapp.png);
    background-repeat: no-repeat;
    background-position: top right;
    background-size: contain;
}
.messenger {
    margin: 0px 0px 0px 0px;
    padding: 0px;
    position: relative;
    width: 50px; height:50px;
    overflow: hidden;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
    background: transparent url(../images/messenger.png);
    background-repeat: no-repeat;
    background-position: top right;
    background-size: contain;
}
.socialstrip2{
  padding: .8em;
  list-style-type: none;
  display: flex;
  flex-direction: row;
}
.socialstrip2 li{
  padding: 0;
  font-size: 3rem;
}
.socialstrip2 li a{
  padding: .2em;
  color: white;
  text-decoration: none;
  border-radius: .2em;
}
.boxhalfmenu {
    margin-top: -19px !important;
}
.boxmega {
    position: relative;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
    background-color: transparent;
}

.contactbg {
    margin: 0px 0px 0px 0px;
    padding: 0px;
    position: relative;
    width: 100%;
    overflow: hidden;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
    background: transparent url(../images/bg/bgcontact.png);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
}
.bordo{
    margin: 0px 0px 0px 0px;
    padding: 5px 5px 5px 5px;
    background-color: red;
    border: 5px solid #ffffff;
    -moz-box-shadow: 0px 0px 2px #000000;
    -webkit-box-shadow: 0px 0px 2px #000000;
    box-shadow: 0px 0px 2px #000000;
    position: relative;
    overflow: hidden;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
}

/*-----------------------------------------------------------------------------------*/
/*	MUSIC PAGE ALBUM ARCHIVE
/*-----------------------------------------------------------------------------------*/

.bordoshopsx {
    font-size:12px;
    padding:0px 0px 0px 0px;
    text-align:left;
    color: #ffffff;
    background-color :#212121;
    position: relative;
    text-align: left;
    font-family:'sans-serif';
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
}
.bordoshopdx {
    font-size:12px;
    padding:0px 0px 0px 0px;
    text-align:left;
    color: #000000;
    background-color: transparent;
    position: relative;
    text-align: left;
    font-family:'sans-serif';
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
}
.bordoshopdx h1 {

    text-align:center;
    color: #000000;
    position: relative;
    font-family:'sans-serif';
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
}
.bordoshop2  {
    font-size:12px;
    padding:0px 0px 0px 0px;
    text-align:center;
    color: #000000;
    background-color: #ffffff;
    position: relative;
    font-family:'Open Sans';
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
}
.bordoshop2 a{
      font-size: 32px;
      line-height: 26px;
      font-family: 'Tahoma', sans-serif;
      color: #000000;
      text-decoration: none;
      transition: all 200ms ease-in;
    -webkit-transition: all 200ms ease-in;
    -o-transition: all 200ms ease-in;
    -moz-transition: all 200ms ease-in;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
}
.bordoshop2 a:hover { color: red;}
.bordoshop2 h4 {
    font-size:12px;
    text-shadow: 0px 0px 8px white, 0 0 0.1em blue, 0 0 0.1em #fff;
    margin:10px 0px 10px 0px;
    text-align:center;
    color: #000;
    background-color: #ffffff;
    position: relative;
    font-family:'sans-serif';
    font-weight:lighter;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
}
.bordodisco {
    margin: 0px auto;
    background-color: transparent;
    border: 0px solid #000000;
    padding: 20px 20px 20px 20px;
    color: #000000;
    position: relative;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
}
.bordodisco p {
    text-align:left;
    font-size:12px;
    line-height:1;
    color:#ffffff;
    margin: 30px 0px 0px 0px;
}
.bordodisco h1 {
    background-color: transparent;
    border: 0px solid #ffffff;
    text-align: center;
    color: #000000;
    position: relative;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
}

/*-----------------------------------------------------------------------------------*/
/*	biografia
/*-----------------------------------------------------------------------------------*/


.contactbg2 {
    margin: 0px 0px 0px 0px;
    padding: 0px;
    position: relative;
    width: 50%;
    overflow: hidden;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
    background: transparent;
}
.contactbg {
    margin: 0px 0px 0px 0px;
    padding: 0px;
    position: relative;
    width: 100%;
    overflow: hidden;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
    background: transparent url(../images/bg/bgcontact.png);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
}
.bordomail {
    font-size:12px;
    padding:20px 20px 20px 20px;
    text-align:left;
    color: #000000;
    background-color: transparent;
    position: relative;
    text-align: left;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
}
.bordo3 {
    margin: 20px auto;
    background-color: transparent;
    border: 0px solid #000000;
    padding: 20px 20px 20px 20px;
    color: #000000;
    position: relative;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
}
.bordo3 h1 {
    background-color: transparent;
    border: 0px solid #ffffff;
    text-align: center;
    color: #000000;
    position: relative;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
}
.bordo3 p {
    text-align:left;
    font-size:12px;
}

.bordoframe{
     position: relative;
     display: inline-block;
     width: 100%;
     text-align: center;
}
.bordofb{
    text-align: left;
    width:100%;
    height:600px;
    margin: 0px 0px 0px 0px;
    background-color: #ffffff;
    border: 0px solid blue;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
}
.bordoframe span{
      position: absolute;
}
.bordowhatapp {
    padding: 0px 20px 0px 20px;
    background-color: transparent;
    border: 0px solid #000000;
    color: #000000;
    position: relative;
}
.bordowhatapp a {
   text-align:left;
}
.bordomusic {
    margin: 0px 0px 0px 0px;
    position: relative;
    width: 100%;
    overflow: hidden;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
    background-color: #ffffff;
}
.tubebooking {
     height:100px; width:100%;
     margin: 0 auto;
}
.booking{
     height:400px; width:100%;
     margin: 0 auto;
}
#booking1{
	 background: transparent url(../images/info/bokkin1.png);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: contain;
}
#booking2{
	 background: transparent url(../images/info/bokkin2.png);
    background-repeat: no-repeat;
    background-position: center center;
    width: 160px;
    background-size: contain;
}
#booking3{
	 background: transparent url(../images/info/bokkin3.png);
    background-repeat: no-repeat;
    background-position: center center;
    width: 160px;
    background-size: contain;
}
#booking4{
 	background: transparent url(../images/info/bokkin4.png);
   background-repeat: no-repeat;
   background-position: center center;
   background-size: contain; width: 160px;
}
#booking5{
	 background: transparent url(../images/info/bokkin5.png);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: contain; width: auto;
}
.whatbooking {
     height:54px; width:100%;
     margin: 0 auto;
}
.infoboxsocial {
    margin: 0px auto;
    padding: 0px 20px 0px 20px;
    overflow:hidden;
    background-color: rgb(255, 0, 41);
background: transparent;
    color: rgba(15, 0, 254, 0.5);
    min-height:150px;
    font-size:2vw;
    color:#000000;
    text-align:left;
    border: 0px solid #000000;
}
.infoboxsocial p {
    margin:0px 0px 0px 0px;
    font-size:14px;
    color:#ffffff;
    text-align:center;
}
.infoboxsocial h3 {
    margin:15% auto;
    font-size:18px;
    color:#e7692b; font-family:'Open Sans';
    text-align:center;
}
.spacer200 {
    height:200px;
    width:100%;
    margin:0 auto;
}

.spacer20{
    height:20px;
    width:100%;
    margin:0 auto;
}
.spacer50{
    height:50px;
    width:100%;
    margin:0 auto;
}
.spacer100 {
    height:100px;
    width:100%;
    margin:0 auto;
}
.inizio {
  background-color:white;
  position:fixed;
  z-index:9999999999;
  border: 1px solid #000000;
  height:40px; width:100%;
}
/*-----------------------------------------------------------------------------------*/
/*	SEZIONE INSTAGRAM
/*-----------------------------------------------------------------------------------*/
.instafoto {
    width:50%;
    height:200px;
    position: relative;
    margin-right: 0px;
    float: left;
}
#insta1 {
    background: transparent url(../images/instagram/1.jpg) no-repeat;
    background-size: cover;
    background-position: center center;
     }
#insta2 {
    background: transparent url(../images/instagram/2.jpg) no-repeat;
    background-size: cover;
    background-position: top left;
}
 #insta3 {
    background: transparent url(../images/instagram/3.jpg) no-repeat;
    background-size: cover;
    background-position: center center;
}
#insta4 {
    background: transparent url(../images/instagram/4.jpg) no-repeat;
    background-size: cover;
    background-position: center center;
}
.instalarge {
    width:100%;
    height:200px;
    position: relative;
    margin-right: 0px;
    float: left;
}
#insta5 {
    background: transparent url(../images/instagram/5.jpg) no-repeat;
    background-size: cover;
    background-position: top center;
}
#insta6 {
    background: transparent url(../images/instagram/6.jpg) no-repeat;
    background-size: cover;
    background-position: center center;
}
.one-half-small {
    width: 45%;
    position: relative;
    margin-right: 0px;
    float: left;
}
.bordoinsta {
	 width:90%;
    margin: 0px auto;
    background-color: transparent;
    border: 0px solid #000000;
    color: #000000;
    position: relative;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box; /* Firefox, other Gecko */
    box-sizing: border-box; /* Opera/IE 8+ */
    float:right;
}
/*-----------------------------------------------------------------------------------*/
/*	SLIDESHOW
/*-----------------------------------------------------------------------------------*/
* {box-sizing:border-box}
/* Slideshow container */
.slideshow-container {
  width: 100%;
  position: relative;
  margin: auto;
}
/* Hide the images by default */
.mySlides {
  display: none;
}
/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  z-index:8;
}
/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}
/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}
/* Caption text */
.text {
  color: #000000;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}
/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}
/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}
/* Fading animation */
.slideInLeft {
  -webkit-animation-name: slideInLeft;
  -webkit-animation-duration: 1.5s;
  animation-name: slideInLeft;
  animation-duration: 1.5s;
}
/*-----------------------------------------------------------------------------------*/
/*	STOP
/*-----------------------------------------------------------------------------------*/