:root{
 --orange: #ffce00; /*giallo LEGO*/
 --red: #ff0000; /*rosso LEGO*/
 --blue: #00dbff; /*ciano LEGO*/
  --paleblue: #80A1C1;
  --green: #ededed;
  --cream: #F6D8AE;
  --darkgrey: #14151f; /*back*/
  --dark: #14151f; /*back*/
  --light: #ACBDBA;
  --boxborder: 1px;
  --ballborder: 2px;
}

/*font-family: 'Pirata One', cursive;*/

html, body{overflow-x: hidden;width: 100%;margin: 0;padding: 0;}
html {
  font-size: 0.8em;
  color: var(--dark);
  background-color: var(--darkgrey);
  text-align: center;
}
/*header portfolio page*/
#header-page h1{font-family: 'Heebo', sans-serif;font-weight: bolder; color: #fff;font-size: 14em;line-height: 1em;}
#header-page h1 span.b{color: #00dbff;}
#header-page h1 span.r{color: #ff0000;}
#header-page h1 span.y{color: #ffce00;}
#header-page h1 span.punto{color: #ff0000;font-size: 1.2em;}

/*header home*/
#header{height: 100vh;background-color: #14151f;display: flex;flex-direction:column;justify-content: center;background-image: url(../img/header-desktop.png);background-position: center;background-size: cover;position:relative;}
#header{height: 100vh;background-color: #14151f;display: flex;flex-direction:column;justify-content: center;background-image: url(../img/header.jpg);background-position: center;background-size: cover;position:relative;}
#header h6{font-family: 'Heebo', sans-serif;color: #fff;text-transform: uppercase;letter-spacing: 5px;font-size: 16px;font-weight: 400;margin: 0;transform: rotate(-5deg);}
#header h6 span{background-color: #000;padding: 5px 10px;}

/*bodoni moda*/
#header h1{font-family: 'Pirata One', cursive;color: #fff;font-size:10rem; }
#header h2{font-family: 'Heebo', sans-serif;color: rgba(255,255,255,0.9);font-size: 18px;font-weight: lighter;margin: 0;margin-top: 0;}
#header h2, #header h1, #header h6{z-index:11;}
#header .noise::before{opacity: 0.05 !important;}



/*scroll items*/
.icon-scroll {
	position: absolute;
	bottom: 5%;
	left: 50%;
  width: 1em;
	height: 3.125em;
	transform: translateX(-50%) scale(2);
	z-index: 99999;
      transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  cursor: pointer;
}
.icon-arrows::after{content: '';}
.icon-arrows span,
.icon-arrows::after{
	display: block;
	width: 0.315em;
	height: 0.315em;
	border-right: 1px solid rgba(255,255,255,.8);
	border-bottom: 1px solid rgba(255,255,255,.8);
	margin: 0 0 0.125em 0.315em;
	transform: rotate(45deg);
  animation: mouse-scroll 1s infinite;
	animation-direction: alternate;
}
        
.icon-scroll span {
	animation-delay: .2s;
}

.icon-arrows::after {
	animation-delay: .3s;
}

.icon-scroll .mouse {
	height: 1.375em;
	width: .875em;
	border: 1px solid rgba(255,255,255,.8);
	border-radius: 2em;
}

.icon-scroll .wheel {
  position: relative;
  display: block;
  height: 0.1875em;
  width: 0.1875em;
  margin: 0.1875em auto 0;
  background: rgba(255,255,255,.8);
  animation: mouse-wheel 1.2s ease infinite;
  border-radius: 50%;
}

@keyframes mouse-wheel {
	0% {
		opacity: 1;
		transform: translateY(0);
	}

	100% {
		opacity: 0;
		transform: translateY(.375em);
	}
}

@keyframes mouse-scroll {
	0%   { opacity: 0; }
	50%  { opacity: .5; }
	100% { opacity: 1; }
}

.icon-scroll:hover .wheel{background: var(--red);  transition: all 0.3s ease;-moz-transition: all 0.3s ease;-webkit-transition: all 0.3s ease;}
/* END scroll items*/


#project a {
  color: var(--dark);
}
/*#project svg:hover{
  background-color: var(--light);
}*/
/*
#project h3:hover {
    -webkit-box-shadow: 0px 0px 10px 0px rgba(255,206,0,0.5);
-moz-box-shadow: 0px 0px 10px 0px rgba(255,206,0,0.5);
box-shadow: 0px 0px 10px 0px rgba(255,206,0,0.5);
  transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
    border: var(--boxborder) solid var(--orange);
    color: var(--orange);
}*/

 

/*#project li img:hover {
  border-color: var(--light);
}*/

#project canvas {
  display: none;
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100px;
  height: 200vh;
}

#project .anarchy {
  position: absolute;
  visibility: hidden;
}
#project img {
  width: 200px;
  height: 200px;
  display: block;
  border-radius: 100%;
  border: var(--ballborder) solid var(--red); 
      -webkit-box-shadow: 0px 0px 13px 0px rgba(255,0,0,0.6);
-moz-box-shadow: 0px 0px 13px 0px rgba(255,0,0,0.6);
box-shadow: 0px 0px 13px 0px rgba(255,0,0,0.6);
  transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
}
#project .photo-progetto img {
  /*width: 200px;
  height: 200px;*/
  display: block;
  border-radius: 100%;
  /*border: var(--ballborder) solid var(--red); */
      -webkit-box-shadow: 0px 0px 13px 0px rgba(255,206,0,0.6);
-moz-box-shadow: 0px 0px 13px 0px rgba(255,206,0,0.6);
box-shadow: 0px 0px 13px 0px rgba(255,206,0,0.6);
  transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
}
#project .photo-progetto:hover img {
      -webkit-box-shadow: 0px 0px 19px 0px rgba(255,206,0,1);
-moz-box-shadow: 0px 0px 19px 0px rgba(255,206,0,1);
box-shadow: 0px 0px 19px 0px rgba(255,206,0,1);
  transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
}

#project .photo-progetto img{
  width: 230px;
  height: 230px;
  border: 5px solid #ffce00; 
      transition: all 0.8s ease;
  -moz-transition: all 0.8s ease;
  -webkit-transition: all 0.8s ease;
}
#project .photo-progetto:hover img{
        transition: all 1s ease;
  -moz-transition: all 1s ease;
  -webkit-transition: all 1s ease;
    transform: scale(1.1);
}


#project .photo img{
  width: 170px;
  height: 170px;
  border: var(--ballborder) solid var(--red); 
}

#project #intro {
  background-color: var(--dark);
  font-size:26px ;
  width: 210px;
  padding: 25px 20px;
    color: #fff;
  font-family: 'Heebo', sans-serif; font-weight: lighter;
  border: var(--boxborder) solid var(--blue);
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,221,255,0.5);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,221,255,0.5);
box-shadow: 0px 0px 10px 0px rgba(0,221,255,0.5);
}
/*#project #intro-tecniche {
  background-color: #14151f;
  font-size:0.9em;
  width: 250px;
  padding: 25px 20px;
    color: #fff;
  font-family: 'Heebo', sans-serif; font-weight: 300;
  border: var(--boxborder) solid var(--blue);
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,221,255,0.5);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,221,255,0.5);
box-shadow: 0px 0px 10px 0px rgba(0,221,255,0.5);
}*/
#project #intro-tecniche,#project .block_p  {

background: rgba(255, 255, 255, 0.06);
border-radius: 16px;
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
border: 1px solid rgba(255, 255, 255, 0.88);
  font-size:1.3rem;
  width: 250px;
  padding: 25px 20px;
    color: #fff;
  font-family: 'Heebo', sans-serif; font-weight: 300;
}

#project #intro-tecniche span, #project .block_p span{font-weight: 600;font-size: 1.5rem;}


.ball-icon {
  background-color: #14151f;
  font-size:0.9em;
  width: 80px;
  height: 80px;
    border-radius: 50%;
  padding: 25px 25px;
    color: #fff;
  font-family: 'Heebo', sans-serif; font-weight: 300;
  border: var(--boxborder) solid var(--blue);
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,221,255,0.5);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,221,255,0.5);
box-shadow: 0px 0px 10px 0px rgba(0,221,255,0.5);
}

.ball-icon span{/*display: inline-block;*/text-align: left;text-transform: uppercase;letter-spacing: 2px;font-size: 11px;font-weight: 400;}
.ball-icon svg.icon{height: 40px !important;width: 40px !important;/*display: inline-block;margin-right: 5px;*/display: block;margin: 0 auto;text-align: center;margin-bottom: 15px;}

/*#project #intro-tecniche span{font-weight: 400;text-transform: uppercase;color: #ffce00;}*/


#project h1 {
  width: 320px;
  height: 140px;
  padding-top: 10px;
  font-family: 'Heebo', sans-serif;
  font-size: 70px;
  background-color: var(--orange);
  border: var(--boxborder) solid var(--dark); 
}

#project h2 {
  width: 150px;
  height: 100px;
  padding-top: 10px;
  font-family: 'Heebo', sans-serif;
  font-size: 50px;
  background-color: var(--orange);
  border: var(--boxborder) solid var(--dark); 
}
#project h6{font-family: 'Heebo', sans-serif;color: #fff;font-size: 16px;}

/*
#project h3 {
  padding: 10px 25px;
  font-family: 'Heebo', sans-serif;
  font-size: 40px;
    line-height: 37px;
    font-weight: 700;
color: #fff;
  background-color: var(--dark); 
  border: var(--boxborder) solid var(--blue); 
  -webkit-box-shadow: 0px 0px 10px 0px rgba(0,221,255,0.5);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,221,255,0.5);
box-shadow: 0px 0px 10px 0px rgba(0,221,255,0.5);
      transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
}
*/

#project h3 {

  font-family: 'Pirata One', cursive;
  font-size: 9rem;
    line-height: 37px;
    font-weight: 700;
color: #fff;
letter-spacing: 1px;
line-height: 0.8em;
/*text-shadow: 6px 0 #14151f, -6px 0 #14151f, 0 6px #14151f, 0 -6px #14151f,
               5px 5px #14151f, -5px -5px #14151f, 5px -5px #14151f, -5px 5px #14151f;*/
               -webkit-text-stroke-width: 10px;
	-webkit-text-stroke-color: #14151f;
     paint-order: stroke fill;
}




#project .smaller {
  width: 240px;
}


/*#project li > .block {
  background-color: rgba(20,21,31,1);
  width: 180px;
  padding: 10px;
  font-family: 'Heebo', sans-serif; font-size: 14px;
  border: var(--boxborder) solid var(--blue); 
    box-shadow:  0px 0px 10px 0px rgba(0,221,255,0.5);
    -webkit-box-shadow:  0px 0px 10px 0px rgba(0,221,255,0.5);
    -moz-box-shadow:  0px 0px 10px 0px rgba(0,221,255,0.5);
}*/
/*#project li > .block p{color: #fff;font-size: 0.9em;}

#project li > .block p span{color: #ffce00;font-weight: bold;}*/
#project p {
  margin-bottom: 10px;
}

svg.icon .cls-1{fill:#ff0000; }

#header h6{animation: float 8s ease-in-out infinite;}
@keyframes float {
	0% {
		transform: translatey(0px) rotate(-5deg); 
	}
	50% {
		transform: translatey(-30px) rotate(-7deg);
	}
	100% {
		transform: translatey(0px) rotate(-5deg);
	}
}
#introduzione{padding: 8% 30%;}
#introduzione h2{text-align: center;font-size: 4.5em;color: #fff;font-weight: 300;}
.lineY{background-color: rgba(255,255,255,0.7);display: block;height: 41px;width: 1px;text-align: center;margin: 0 auto;}

#project li > .block-svg {  width: 110px;
  height: 110px;display: flex;align-items: center;justify-content: center;}

.block-social{width: auto !important;border-radius: 90px;}
.block-social ul{list-style: none;padding: 0 !important;}
.block-social ul li{float: left;margin-left: 5px;margin-right: 5px;border-radius: 100%;background-color:#14151f;}
.block-social ul li:hover{background-color:#ff0000;}
.block-social ul li img{height: 50px !important;width: 50px !important;border: 2px solid #ff0000;}
.block-social ul li img:hover{-webkit-box-shadow: 0px 0px 30px 0px rgba(255,0,0,1) !important;
-moz-box-shadow: 0px 0px 30px 0px rgba(255,0,0,1) !important;
box-shadow: 0px 0px 30px 0px rgba(255,0,0,1) !important;}

/*mysocial*/

#header-mysocial{height: 100vh;background-color: #14151f;display: flex;flex-direction:column;justify-content: center;overflow-y: hidden;}
#header-mysocial h1{font-family: 'Pirata One', cursive;color: #fff;font-size: 12em;line-height: 1em;margin-top: 0;margin-bottom: 0;z-index: 11;}
#header-mysocial h2{font-family: 'Heebo', sans-serif;color: #fff;text-transform: uppercase;letter-spacing: 5px;font-size: 16px;font-weight: 400;margin-top: 2em;z-index: 11;}
#header-mysocial p{margin-bottom: 3em;}
#header-mysocial p a{font-family: 'Heebo', sans-serif;z-index: 11;text-align: center;color: #fff;font-size: 16px;text-decoration: none; border-bottom:2px solid #ff0000;font-weight: 400;}
#header-mysocial p:hover a{color: #fff;text-decoration: none;border-bottom:2px solid #fff;}

/*PG INTERNE*/
.txt-center-portfolio{/*margin-left: 120px;*/z-index: 11;}
#banda-sx{position: absolute;background-color:transparent;height: 100vh;top: 0;left: 0;width: 120px;z-index: 11;padding-top: 3em;}
#banda-sx .arrow{border-radius: 50%;height: 50px;width: 50px;text-align: center;border: 2px solid #fff;margin-left: 35px;}
#banda-sx .arrow:hover{border: 2px solid #ffce00;background-color: #ffce00;}
#banda-sx .arrow img{height: 20px;width: auto; margin-top: 13px;text-align: center;}
#banda-sx h5{font-family: 'Heebo', sans-serif;color: #fff;font-weight: 400;font-size: 16px;text-transform: uppercase;letter-spacing: 2px; text-align: center;transform: rotate(-90deg);margin-top: 40vh;}
#header-page{background-color: #14151f;height: 100vh;text-align: center;display: flex;flex-direction:column;justify-content: center;overflow: hidden;overflow: hidden !important;position:relative;}
#header-page h1{z-index: 11;}

.blocco-img{background-position: center;background-repeat: no-repeat;background-size: cover;height: 60vh;}
.blocco-img-full{background-position: center;background-repeat: no-repeat;background-size: cover;height: 75vh;}
.row-color{background-color: #14151f;}
.noise::before{
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    max-height: 100vh;
    content: "";
  
    opacity: .1;  
    z-index: 9;
    pointer-events: none;
    background: url(../img/noise.gif) ;
    overflow: hidden;
}
.blocco-txt{text-align: center;display: flex;flex-direction:column;justify-content: center;}
.row-btn{display: flex;justify-content: center;}
.row-btn ul{list-style: none;padding-left: 0;}
.row-btn li{margin-left: 30px;margin-right: 30px; float: left;padding: 10px 15px;border-bottom: 2px solid #fff;cursor: pointer;}
.row-btn ul li a{font-family: 'Pirata One', cursive;color: #fff;font-size: 2em;text-decoration: none;letter-spacing: 1px;transition: all 0.4 ease;-ms-transition: all 0.4 ease;-webkit-transition: all 0.4 ease;-moz-transition: all 0.4 ease;}
.row-btn ul li a:hover{text-decoration: none;}
.row-btn li:hover{ border-bottom: 2px solid #ff0000;transition: all 0.4 ease;-ms-transition: all 0.4 ease;-webkit-transition: all 0.4 ease;-moz-transition: all 0.4 ease;}
.space-column-sx{border-left: 20px solid #fff;margin-top: 10em;}
.row-interfaccia img{width: 800px;height: auto;position: absolute;top: 10%;z-index: 11;}
.row-interfaccia{position: relative;min-height: 600px;text-align: center;margin-bottom: 5%;margin-top: 5%;}
.row-interfaccia #pg-1{animation: float-1 9s ease-in-out infinite;left: 0;}
.row-interfaccia #pg-2{animation: float-2 10s ease-in-out infinite;left: 5%;}
.row-interfaccia #pg-3{animation: float-3 11s ease-in-out infinite;left: 10%;}
.row-interfaccia #pg-4{animation: float-4 12s ease-in-out infinite;left: 15%;}
.row-interfaccia .noise::before{opacity: 0.05 !important;}
.paragrafo-portfolio{font-family: 'Heebo', sans-serif;color: #14151f;font-size: 17px;font-weight: 300;text-align: left;}
.txt-portfolio-title{position: absolute;right: 7%;top: 30%;z-index: 11;}
.txt-portfolio-title h5{font-family: 'Pirata One', cursive;color: #fff;font-size: 15em;}
.txt-portfolio-title p{font-family: 'Heebo', sans-serif;color: #fff;font-size: 0.9em;text-transform: uppercase;letter-spacing: 2px;}
.padding-txt{padding-left: 40%;padding-right: 10%;}
.padding-txt .paragrafo-portfolio{padding-top: 20%; padding-left: 25px;border-left: 1px solid #ff0000;}
.footer{padding-bottom: 5%;padding-top: 3%;}
.footer h3{font-family: 'Heebo', sans-serif;color: #14151f;font-size: 200px;font-weight: bolder;text-align: center;margin-top: 0;margin-bottom: 0;line-height: 1em;}
.footer h3 span{color: #ff0000;}
.footer .block-social{display: flex !important;
  align-items: center !important;
  justify-content: center !important;margin-top: 5%;}
.footer .block-social li{border-radius: 100%;overflow: hidden;border: 2px solid #fff; transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;}
.footer .block-social li:hover{ transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;border: 2px solid #ff0000;}
.footer .block-social ul li img{border: none;}


@keyframes float-1 {
	0% {
		transform: translatey(0px) rotate(-5deg); 
	}
	50% {
		transform: translatey(-30px) rotate(-7deg);
	}
	100% {
		transform: translatey(0px) rotate(-5deg);
	}
}
@keyframes float-2 {
	0% {
		transform: translatey(0px) rotate(-5deg); 
	}
	50% {
		transform: translatey(-30px) rotate(-7deg);
	}
	100% {
		transform: translatey(0px) rotate(-5deg);
	}
}
@keyframes float-3 {
	0% {
		transform: translatey(0px) rotate(-5deg); 
	}
	50% {
		transform: translatey(-30px) rotate(-7deg);
	}
	100% {
		transform: translatey(0px) rotate(-5deg);
	}
}
@keyframes float-4 {
	0% {
		transform: translatey(0px) rotate(-5deg); 
	}
	50% {
		transform: translatey(-30px) rotate(-7deg);
	}
	100% {
		transform: translatey(0px) rotate(-5deg);
	}
}
.linkz{font-family: 'Pirata One', cursive;color: #14151f;font-size: 6em;transform: rotate(-6deg);}
.linkz a{color: #14151f;}
.linkz a:hover{color: #ff0f8e;text-decoration: none;}
.linkz span{background-image: url(../img/bg-halftone.png);padding: 10px 30px;}
.go-down{text-align: center;position: absolute;bottom: 5vh;left: 50%;margin-left: -17px;animation: upDown 5s ease-in-out infinite;}
.go-down img{width: 34px;}


@keyframes upDown {
	0% {
		transform: translatey(0px); 
	}
	50% {
		transform: translatey(-30px);
	}
	100% {
		transform: translatey(0px);
	}
}

.row-strategia{background-color: #edefee;padding-bottom: 5%;padding-top: 5%;margin-bottom: 5%;margin-top: 5%;background-position: center left;background-size: 60% auto;background-repeat: no-repeat;background-image: url(../img/portfolio/strategia-marketing.jpg);height: 50vh;display: flex;align-items: center;}
.txt-strategia{text-align: center;float: right;}
.txt-strategia h5{font-family: 'Pirata One', cursive;color: #14151f;font-size: 12em;}
.txt-strategia p{font-family: 'Heebo', sans-serif;color: #14151f;font-size: 0.9em;text-transform: uppercase;letter-spacing: 2px;}

/*web*/
#web01{background-image: url(../img/portfolio/beton.gif);}
#web02{background-image: url(../img/portfolio/steriltom.jpg);}
#web03{background-image: url(../img/portfolio/gs.gif);}
#web04{background-image: url(../img/portfolio/river.gif);}
#web05{background-image: url(../img/portfolio/plastic.jpg);}
#web06{background-image: url(../img/portfolio/malcesine.gif);}
#web07{background-image: url(../img/portfolio/ws.gif);}
#web08{background-image: url(../img/portfolio/ashanti.gif);}
#web09{background-image: url(../img/portfolio/studiart.gif);}
/*art*/
#art01{background-image: url(../img/portfolio/elettrondata.jpg);}
#art02{background-image: url(../img/portfolio/pack-river.jpg);}
#art03{background-image: url(../img/portfolio/pack.jpg);}
#art04{background-image: url(../img/portfolio/amada-tour.gif);}
#art05{background-image: url(../img/portfolio/es.jpg);}
#art06{background-image: url(../img/portfolio/calendario.jpg);}
#art07{background-image: url(../img/portfolio/catalogo-gs.gif);}
#art08{background-image: url(../img/portfolio/stellafly.jpg);}
#art09{background-image: url(../img/portfolio/gallery.jpg);}

.finale{padding-left: 30%;padding-right: 30%;width: 100%;height: auto;margin-top: 5%;}




/*****************media query*****************/
@media screen and (max-width: 1300px) {
    .txt-portfolio-title{right: 5%;}
    .txt-portfolio-title h5{font-size: 11em;}
    
}
@media screen and (max-width: 1200px) {
    .row-interfaccia{min-height:400px;}
    .row-interfaccia img{width: 600px;}
    #header{background-image: url(../img/header-mini-desktop.png);}
}
@media screen and (max-width: 1100px) {
    .txt-portfolio-title p{font-size: 0.75em;}
    .txt-portfolio-title h5{font-size: 9em;}
     .row-interfaccia{min-height:300px;}
    .row-interfaccia img{width: 500px;}
    .blocco-img{height: 40vh;}
    .padding-txt{    padding-left: 20%;
    padding-right: 0;}
#introduzione{padding: 8% 20%;}
    .paragrafo-portfolio{font-size: 15px;padding-left: 10%;}

}
@media screen and (max-width: 992px) {
    .finale{padding-left: 0;padding-right: 0;margin-top: 0;}
    .txt-portfolio-title{    right: auto;
    text-align: center;
    display: block;
    width: 100%;
    margin-top: 200px;}
    .txt-strategia{display: none;}
    .row-strategia{background-position: center;background-size: 100% auto;margin-bottom: 0;margin-top: 0;}
    .txt-portfolio-title p{font-size: 0.75em;}
        .row-interfaccia{min-height:550px;}
    .row-interfaccia img{width: 500px;}
    .txt-portfolio-title h5{font-size: 7em;}
.txt-center-portfolio{margin-left: 0;}
#banda-sx .arrow{background-color: rgba(255,255,255,1);border: 2px solid #fff;}
#banda-sx h5{font-size: 13px;color: #fff;}
#banda-sx{width: 90px;background-color: transparent;}
#header-page h1{font-size: 10em;}
.mobile-nope{display: none;}
.icon-scroll{display: none !important;}
#header{background-image: url(../img/header-tablet.png);}
#header h1{font-size: 7em;line-height: 1em;margin-top: 0.7em;}
#header h2{font-size: 16px;}
#header h6{font-size: 14px;}
#project {
    max-width: 100vw !important;
    overflow-x: hidden !important;
     box-sizing: border-box !important;
    flex-wrap: wrap !important; 
}
/*#header {
    width: 100vw !important;
    max-width: 100% !important;
    margin: 0 auto;
}*/
}
@media screen and (max-width: 890px) {
html, body{overflow-x:hidden !important;width:100vw;}
     .paragrafo-portfolio{font-size: 14px;padding-right: 5%;}
#introduzione h2{font-size:3em; }
}
@media screen and (max-width: 790px) {
#header-page h1{font-size: 8em;}
#header{background-image: url(../img/header-phone.png);}
}
@media screen and (max-width: 770px) {
    .padding-txt{margin-bottom: 5%;}
}
@media screen and (max-width: 620px) {
    #banda-sx h5{display: none;}
#header-mysocial h1{font-size: 9em;}
#header-mysocial h2{font-size: 13px;}
#header h1{font-size: 6em;margin-top: 0.6em;}
#header h2{font-size: 15px;}
#introduzione h2{font-size:2em;}
#header-page h1{font-size: 7em;}
.footer .block-social{margin-top: 90px;margin-bottom: 50px;display: block;}
}
@media screen and (max-width: 580px) {
    .footer{margin-bottom: 5%;}
    .footer h3{font-size: 100px;}
.row-interfaccia{margin-top: 0;margin-bottom: 0;}
    .space-column-sx{border-left: 0px solid transparent;
    margin-top: 0;}
    .row-strategia{margin-bottom: 0;margin-top: 0;}
   .footer .block-social{display: none !important;}
}
@media screen and (max-width: 490px) {
    .footer h3{font-size: 80px;}
    .txt-portfolio-title{margin-top:150px; }
           .row-interfaccia{min-height:450px;}
    .row-interfaccia img{width: 400px;}
#header-page h1{font-size: 5em;}
.lineY{display: none;}
#introduzione{padding: 4% 10%;}
#header h1{font-size: 5em;margin-top: 0.6em;}
#header h2{font-size: 14px;}
}
@media screen and (max-width: 420px) { .footer{margin-bottom: 10%;}.footer h3{font-size: 50px;}}
@media screen and (max-width: 390px) {
    .txt-portfolio-title p{letter-spacing: 0;}
    .txt-portfolio-title h5{font-size: 6em;}
     .txt-portfolio-title{margin-top:100px; }
           .row-interfaccia{min-height:400px;}
    .row-interfaccia img{width: 300px;}
#header-mysocial h1{font-size: 8em;}
#header-mysocial h2{font-size: 12px;}
#header{padding-left: 10%;padding-right: 10%;}
#header h1{font-size: 4em;}
#header h2{line-height: 13px;margin-top: 10px;}
}
@media screen and (max-width: 330px) {
#header{padding-left: 10%;padding-right: 10%;}
#header h6{line-height: 40px;}
#header h1{font-size: 3em;}
#header h2{font-size: 13px;}

}

html, body {
    width: 100vw;
    overflow-x: hidden !important;
    position: relative;
}

.anarko{font-family: 'Pirata One', cursive;opacity:0.5;font-size:5em;}

/*
body {
    overflow-x: hidden !important;
}
*/
/*----------FAKE ALERT-------------*/

  #fake-alert {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #C0C0C0;
    color: black;
    font-family: 'Courier New', monospace;
    font-size: 1em;
    width: 400px;
    border: 2px solid black;
    z-index: 999999999999;
    box-shadow: 4px 4px black;
  }

  #fake-alert-header {
    font-size: 1.3rem;
    background: navy;
    color: white;
    padding: 5px;
    font-weight: bold;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  #fake-alert-body {
    font-size: 1.3rem;
    padding: 15px;
    text-align: center;
  }
  #fake-alert-body a:hover{
    color: red;;
  }
  #close-alert {
    background: red;
    color: white;
    border: none;
    font-weight: bold;
    padding: 2px 8px;
    cursor: pointer;
  }

.anarko{font-family: 'Pirata One', cursive !important;}

.glitch {
  position: relative;
  color: white;
  animation: glitch 1s infinite;
}

@keyframes glitch {
  0% { text-shadow: 2px 0 red, -2px 0 blue; }
  20% { text-shadow: -2px -2px lime, 2px 2px magenta; }
  40% { text-shadow: 2px 2px cyan, -2px -2px red; }
  60% { text-shadow: 2px 0 yellow, -2px 0 blue; }
  80% { text-shadow: -1px 1px orange, 1px -1px purple; }
  100% { text-shadow: none; }
}