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

.mobile-alert{
  display: none;
}

*{
	margin: 0;
	padding: 0;
}

/*
img{
	max-width:100%;
	height:auto;
}
*/

.container{
	width: 100%;
	height: 100vh;
	background-image: linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.7)),url(img/gianni-concert.jpg);
	background-position: center;
	background-size: cover;
	padding-left: 8%;
	padding-right: 8%;
	box-sizing: border-box;
}

.navbar{
	height: 12%;
	display: flex;
	align-items: center;
}

.logo{
	margin-top: 30px;
	width: 200px;
	cursor: pointer;
}

.menu-icon{
	margin-top: 33px;
	width: 25px;
	cursor: pointer;
	margin-left: 40px;
}

nav{
	margin-top: 30px;
	flex: 1;
	text-align: right;
}

nav ul li{
	font-family: 'Noto Sans', sans-serif;;
	list-style: none;
	display: inline-block;
	margin-left: 60px;
}

nav ul li a{
	text-decoration: none;
	color: #fff;
	font-size: 13px;
}

#blink-dot{
	animation: blinker 3s linear infinite;
}

@keyframes blinker{
	50% {
    opacity: 0;
  }
}

.row{
	font-family: Ubuntu, sans-serif;
	display: flex;
	height: 88%;
	align-items: center;
}

.col-2{
	flex-basis: 50;
}

.p1{
	animation: fade-in 1s;
	color: #fff;
	font-weight: 800;
	font-size: 20px;
	line-height: 25px;
  font-family: Ubuntu, sans-serif;
}

.p2{
	animation: fade-in-slow 3s;
  color: #fff;
  font-weight: 800;
  font-size: 20px;
  line-height: 25px;
  font-family: Ubuntu, sans-serif;
}

.button-fadeIn{
	animation: button-fadeIn 3s;
}

.titolo-inizio{
	color: #fff;
	font-size: 100px;
  font-family: Ubuntu, sans-serif;
}

@keyframes fade-in {
  0% {
  opacity: 0;
  transform: scale3d(.75,.75,1);
  }
  70% {
  opacity: 0;
  transform: scale3d(.75,.75,1); 
  }
  100% {opacity: 1;
  transform: scale3d(1,1,1);
  }
}

@keyframes fade-in-slow {
  0% {
  opacity: 0;
  transform: scale3d(.75,.75,1);
  }
  50%{
  	opacity: 0;
  	transform: scale3d(.75,.75,1);
  }
  100% {opacity: 1;
  transform: scale3d(1,1,1);
  }
}

@keyframes button-fadeIn {
  0% {
  opacity: 0;
  transform: scale3d(.75,.75,1);
  }
  90% {
  opacity: 0;
  transform: scale3d(.75,.75,1); 
  }
  100% {opacity: 1;
  transform: scale3d(1,1,1);
  }
}

.btn {
  font-size: 1em;
  line-height: 1em;
  letter-spacing: 0.04em;
  display: inline-block;
}
.btn--svg {
  position: relative;
  height: 42px;
  width: 190px;
  overflow: hidden;
  border-radius: 21px;
}
.btn--svg:hover .btn--svg__circle circle {
  transform: scale(0);
}
.btn--svg:hover .btn--svg__label {
  color: #fff;
}
.btn--svg:hover .btn--svg__border--left path,
.btn--svg:hover .btn--svg__border--right path {
  stroke-dasharray: 61.8204345703 61.8204345703;
  stroke-dashoffset: 0;
  -webkit-transition-delay: 0.25s;
  -webkit-transition-duration: 0.5s;
  -webkit-transition-timing-function: ease-in-out;
  -webkit-transition-property: stroke-dashoffset;
  -moz-transition-delay: 0.25s;
  -moz-transition-duration: 0.5s;
  -moz-transition-timing-function: ease-in-out;
  -moz-transition-property: stroke-dashoffset;
  -ms-transition-delay: 0.25s;
  -ms-transition-duration: 0.5s;
  -ms-transition-timing-function: ease-in-out;
  -ms-transition-property: stroke-dashoffset;
  transition-delay: 0.25s;
  transition-duration: 0.5s;
  transition-timing-function: ease-in-out;
  transition-property: stroke-dashoffset;
}
.btn--svg__label {
  -webkit-font-smoothing: antialiased;
  font-family: sans-serif;
  font-weight: bold;
  text-align: center;
  color: black;
  z-index: 3;
  width: 100%;
  transition: color 0.5s ease-in-out;
}
.btn--svg__circle circle {
  -webkit-transition: transform 0.5s ease-in-out;
  -webkit-transform: scale(1.1);
  -webkit-transform-origin: 50% 50%;
  -moz-transition: transform 0.5s ease-in-out;
  -moz-transform: scale(1.1);
  -moz-transform-origin: 50% 50%;
  -ms-transition: transform 0.5s ease-in-out;
  -ms-transform: scale(1.1);
  -ms-transform-origin: 50% 50%;
  transition: transform 0.5s ease-in-out;
  transform: scale(1.1);
  transform-origin: 50% 50%;
}
.btn--svg__border--left path, .btn--svg__border--right path {
  stroke-dasharray: 61.8204345703 61.8204345703;
  -webkit-transition-duration: 0s;
  -webkit-transition-timing-function: ease-in-out;
  -webkit-transition-property: stroke-dashoffset;
  -webkit-transition-delay: 0.5s;
  -moz-transition-duration: 0s;
  -moz-transition-timing-function: ease-in-out;
  -moz-transition-property: stroke-dashoffset;
  -moz-transition-delay: 0.5s;
  -ms-transition-duration: 0s;
  -ms-transition-timing-function: ease-in-out;
  -ms-transition-property: stroke-dashoffset;
  -ms-transition-delay: 0.5s;
  transition-duration: 0s;
  transition-timing-function: ease-in-out;
  transition-property: stroke-dashoffset;
  transition-delay: 0.5s;
}
.btn--svg__border--left path {
  stroke-dashoffset: -61.8204345703;
}
.btn--svg__border--right path {
  stroke-dashoffset: 61.8204345703;
}
.btn--svg svg, .btn--svg__label {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -webkit-transform-origin: 50% 50%;
  -moz-transform: translate(-50%, -50%);
  -moz-transform-origin: 50% 50%;
  -ms-transform: translate(-50%, -50%);
  -ms-transform-origin: 50% 50%;
  transform: translate(-50%, -50%);
  transform-origin: 50% 50%;
}

.c-white {
  color: white;
}

.trailer {
  margin-bottom: 40px;
}
.trailer--nano {
  margin-bottom: 10px;
}

.bottonefigo {
  position: relative;
  text-decoration: none;
}
.redcolor{
  color: red;
}
.bottonefigo:after {
  content: "";
  height: 1px;
  bottom: -4px;
  position: absolute;
  left: 5%;
  right: 95%;
  background: red;
  transition: right 0.25s ease-in-out;
}
.bottonefigo:hover:after {
  right: 5%;
}

.teasing-1,
.heading-2 {
  font-family: sans-serif;
  letter-spacing: 0.04em;
  -webkit-font-smoothing: antialiased;
}

.teasing-1 {
  font-size: 14px;
  line-height: 14px;
}

.heading-2 {
  font-weight: bold;
  font-size: 20px;
  line-height: 20px;
  text-transform: uppercase;
}

.container2{
  position: relative;
  text-align: center;
  color: white;
  background: url(img/mabg.jpg);
  width: 100%;
  box-sizing: border-box;
  background-size: cover;
}

.square{
  background-color: rgba(0,0,0, 0.4); 
  height: 100%;
  width: 100%;
  color: white;
  text-align: center;
  position: relative;
}

.testocont {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.titolo{
  font-family: Ubuntu, sans-serif;
  font-size: 50px;
}

.bottone2 {
  width: 170px;
  padding-top: 30px;
  padding-bottom: 30px;
  text-align: center;
  color: #000;
  font-weight: 600;
  margin-left: 30px;
  margin-bottom: 30px;
  cursor: pointer;
  display: inline-block;
}

.bottoneGMA {
  background-color: rgba(0,0,0,0.4);
  border: 3px solid #FFFFFF;
  border-radius: 50px;
  -webkit-transition: all .15s ease-in-out;
  transition: all .15s ease-in-out;
  color: #FFFFFF;
  text-decoration: none;
}
.bottoneGMA:hover {
  box-shadow: 0 0 10px 0 #ffec23 inset, 0 0 20px 2px #ffec23;
  border: 3px solid #ffec23;
}

.fontUbuntu{
  font-family: Ubuntu, sans-serif;
}

.small-container{
  margin: auto;
  padding-top: 3%;
  padding-left: 10%;
  padding-right: 10%;
}

.titologruppo{
  text-align: center;
  margin: 0 auto 80px;
  position: relative;
  margin-bottom: 5%;
  color: #000;
  font-family: Ubuntu, sans-serif;
}

.sottolineato{
  text-decoration: underline;
  text-decoration-color: red;
  text-underline-offset: 3px;
  text-decoration-thickness: 3px;
}

.sopralineato{
  text-decoration: overline;
  text-decoration-color: red;
  text-overline-offset: 3px;
  text-decoration-thickness: 3px;
}

.col-4{
  text-align: center;
  flex-basis: 25%;
  padding: 10px;
  min-width: 200px;
  margin-bottom: 50px;
}

.col-4 img{
  margin-bottom: 5%;
  width: 80%;
}

.moveup {
  padding: 1em;
  width: fit-content;
  transition: 0.3s;
}

.moveup:hover {
  box-shadow: 0 0 3px black;
  margin-top: -10px;
}

.small-container-2{
  margin: auto;
  padding-top: 3%;
  padding-left: 6%;
  padding-right: 6%;
  justify-content: center;
  align-items: center;
}

#Download_RAM{
  background: radial-gradient(#ef73e7,#457fe0);
  margin-bottom: 40px;
}

.offerta-speciale{
  font-size: 1.3em;
}
.ram-dl-lineheight1{
  line-height: 40px;
}
.ram-dl-padding1{
  padding-top: 5px;
}


/* GLOW EFFECT */
.glow {
  color: #fff;
  -webkit-animation: glow 1s ease-in-out infinite alternate;
  -moz-animation: glow 1s ease-in-out infinite alternate;
  animation: glow 1s ease-in-out infinite alternate;
}

@-webkit-keyframes glow {
  from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #e60073, 0 0 40px #e60073, 0 0 50px #e60073, 0 0 60px #e60073, 0 0 70px #e60073;
  }
  to {
    text-shadow: 0 0 20px #fff, 0 0 30px #ff4da6, 0 0 40px #ff4da6, 0 0 50px #ff4da6, 0 0 60px #ff4da6, 0 0 70px #ff4da6, 0 0 80px #ff4da6;
  }
}


/* FLASH */
@keyframes flash {
  from {
    text-shadow: 
      0 0 5px #fc0303,
      0 0 10px #fc0303,
      0 0 20px #fc0303,
      0 0 40px #fc0303;
  }
  to {
    text-shadow: 
      0 0 5px #03cafc,
      0 0 10px #03cafc,
      0 0 20px #03cafc,
      0 0 40px #03cafc;
  }
}

/* FLASH GLOW (SGRAVATA USE WITH CAUTION) */
.fglow {
  /* KEYFRAMES DURATION FUNCTION REPEAT DIRECTION */
  animation: flash 0.2s ease infinite alternate;
}

#FPS_Overclock{
  margin-bottom: 40px;
  background-image: linear-gradient(rgba(0,0,0,0.8),rgba(0,0,0,0.8)),url('img/fps-oc_bg.jpg');
  background-size: cover;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  width: 100%;
  flex-direction: column;
  color: white;
  text-align: center;
  padding: 10%;
}

.bottonespeciale-nav-ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.bottonespeciale-nav-ul-li{
  --c: white;
    color: var(--c);
    font-size: 16px;
    border: 0.3em solid var(--c);
    border-radius: 0.5em;
    width: 12em;
    height: 3em;
    text-transform: uppercase;
    font-weight: bold;
    font-family: sans-serif;
    letter-spacing: 0.1em;
    text-align: center;
    line-height: 3em;
    position: relative;
    overflow: hidden;
    z-index: 1;
    transition: 0.5s;
    margin: 1em;
}
.bottonespeciale-nav-ul-li-span{
  position: absolute;
    width: 25%;
    height: 100%;
    background-color: var(--c);
    transform: translateY(150%);
    border-radius: 50%;
    left: calc((var(--n) - 1) * 25%);
    transition: 0.5s;
    transition-delay: calc((var(--n) - 1) * 0.1s);
    z-index: -1;
}
.bottonespeciale-nav-ul-li:hover{
  color:black;
}
.bottonespeciale-nav-ul-li:hover .bottonespeciale-nav-ul-li-span{
  transform: translateY(0) scale(2);
}
.bottonespeciale-nav-ul-li-span:nth-child(1) {
  --n: 1;
}
.bottonespeciale-nav-ul-li-span:nth-child(2) {
  --n: 2;
}
.bottonespeciale-nav-ul-li-span:nth-child(3) {
  --n: 3;
}
.bottonespeciale-nav-ul-li-span:nth-child(4) {
  --n: 4;
}
.traslateY-minus20{
  transform: translateY(-20px);
}
}







@media only screen and (max-width: 800px){



  /* glitch effect */
  /* https://www.youtube.com/watch?v=iEn_iUjS2Wk <-- didn't try
   https://codes4education.com/awesome-text-glitch-animation-effect-in-html-css/   */
.glitch{
  position:relative;
  transform:scale(2, 4);
} 
.glitch::before,
.glitch::after{
  position:absolute;
  top:0;
  left:0;
  content:attr(data-text);
  background:var(--main-bg-color);
  clip:rect(0,0,0,0);
  width:100%;
}
.glitch::before{
  animation:glitch-2 3s 500 linear alternate-reverse;
  left:-2px;
  text-shadow: 1px 0 #fbe601, 2px 0 #eb3406;
}
.glitch::after{
  animation:glitch-1 2s 500 linear alternate-reverse;
  left:2px;
  text-shadow: 1px 0 #63c3ea, 2px 0 #2b30d1;
}
@-webkit-keyframes glitch-1 {
  0% {
    clip: rect(25px, 600px, 4px, 0);
  }
  5.88235% {
    clip: rect(22px, 600px, 12px, 0);
  }
  11.76471% {
    clip: rect(44px, 600px, 20px, 0);
  }
  17.64706% {
    clip: rect(7px, 600px, 29px, 0);
  }
  23.52941% {
    clip: rect(13px, 600px, 18px, 0);
  }
  29.41176% {
    clip: rect(21px, 600px, 31px, 0);
  }
  35.29412% {
    clip: rect(17px, 600px, 20px, 0);
  }
  41.17647% {
    clip: rect(41px, 600px, 7px, 0);
  }
  47.05882% {
    clip: rect(43px, 600px, 2px, 0);
  }
  52.94118% {
    clip: rect(44px, 600px, 12px, 0);
  }
  58.82353% {
    clip: rect(44px, 600px, 22px, 0);
  }
  64.70588% {
    clip: rect(10px, 600px, 17px, 0);
  }
  70.58824% {
    clip: rect(31px, 600px, 13px, 0);
  }
  76.47059% {
    clip: rect(40px, 600px, 22px, 0);
  }
  82.35294% {
    clip: rect(16px, 600px, 30px, 0);
  }
  88.23529% {
    clip: rect(33px, 600px, 34px, 0);
  }
  94.11765% {
    clip: rect(9px, 600px, 40px, 0);
  }
  to {
    clip: rect(45px, 600px, 21px, 0);
  }
}
@keyframes glitch-1 {
  0% {
    clip: rect(25px, 600px, 4px, 0);
  }
  5.88235% {
    clip: rect(22px, 600px, 12px, 0);
  }
  11.76471% {
    clip: rect(44px, 600px, 20px, 0);
  }
  17.64706% {
    clip: rect(7px, 600px, 29px, 0);
  }
  23.52941% {
    clip: rect(13px, 600px, 18px, 0);
  }
  29.41176% {
    clip: rect(21px, 600px, 31px, 0);
  }
  35.29412% {
    clip: rect(17px, 600px, 20px, 0);
  }
  41.17647% {
    clip: rect(41px, 600px, 7px, 0);
  }
  47.05882% {
    clip: rect(43px, 600px, 2px, 0);
  }
  52.94118% {
    clip: rect(44px, 600px, 12px, 0);
  }
  58.82353% {
    clip: rect(44px, 600px, 22px, 0);
  }
  64.70588% {
    clip: rect(10px, 600px, 17px, 0);
  }
  70.58824% {
    clip: rect(31px, 600px, 13px, 0);
  }
  76.47059% {
    clip: rect(40px, 600px, 22px, 0);
  }
  82.35294% {
    clip: rect(16px, 600px, 30px, 0);
  }
  88.23529% {
    clip: rect(33px, 600px, 34px, 0);
  }
  94.11765% {
    clip: rect(9px, 600px, 40px, 0);
  }
  to {
    clip: rect(45px, 600px, 21px, 0);
  }
}
@-webkit-keyframes glitch-2 {
  0% {
    clip: rect(8px, 600px, 50px, 0);
  }
  5.88235% {
    clip: rect(40px, 600px, 41px, 0);
  }
  11.76471% {
    clip: rect(33px, 600px, 16px, 0);
  }
  17.64706% {
    clip: rect(41px, 600px, 9px, 0);
  }
  23.52941% {
    clip: rect(14px, 600px, 30px, 0);
  }
  29.41176% {
    clip: rect(22px, 600px, 33px, 0);
  }
  35.29412% {
    clip: rect(37px, 600px, 48px, 0);
  }
  41.17647% {
    clip: rect(25px, 600px, 37px, 0);
  }
  47.05882% {
    clip: rect(1px, 600px, 18px, 0);
  }
  52.94118% {
    clip: rect(19px, 600px, 27px, 0);
  }
  58.82353% {
    clip: rect(33px, 600px, 29px, 0);
  }
  64.70588% {
    clip: rect(2px, 600px, 38px, 0);
  }
  70.58824% {
    clip: rect(18px, 600px, 41px, 0);
  }
  76.47059% {
    clip: rect(19px, 600px, 45px, 0);
  }
  82.35294% {
    clip: rect(44px, 600px, 32px, 0);
  }
  88.23529% {
    clip: rect(13px, 600px, 43px, 0);
  }
  94.11765% {
    clip: rect(4px, 600px, 6px, 0);
  }
  to {
    clip: rect(30px, 600px, 25px, 0);
  }
}
@-keyframes glitch-2 {
  0% {
    clip: rect(8px, 600px, 50px, 0);
  }
  5.88235% {
    clip: rect(40px, 600px, 41px, 0);
  }
  11.76471% {
    clip: rect(33px, 600px, 16px, 0);
  }
  17.64706% {
    clip: rect(41px, 600px, 9px, 0);
  }
  23.52941% {
    clip: rect(14px, 600px, 30px, 0);
  }
  29.41176% {
    clip: rect(22px, 600px, 33px, 0);
  }
  35.29412% {
    clip: rect(37px, 600px, 48px, 0);
  }
  41.17647% {
    clip: rect(25px, 600px, 37px, 0);
  }
  47.05882% {
    clip: rect(1px, 600px, 18px, 0);
  }
  52.94118% {
    clip: rect(19px, 600px, 27px, 0);
  }
  58.82353% {
    clip: rect(33px, 600px, 29px, 0);
  }
  64.70588% {
    clip: rect(2px, 600px, 38px, 0);
  }
  70.58824% {
    clip: rect(18px, 600px, 41px, 0);
  }
  76.47059% {
    clip: rect(19px, 600px, 45px, 0);
  }
  82.35294% {
    clip: rect(44px, 600px, 32px, 0);
  }
  88.23529% {
    clip: rect(13px, 600px, 43px, 0);
  }
  94.11765% {
    clip: rect(4px, 600px, 6px, 0);
  }
  to {
    clip: rect(30px, 600px, 25px, 0);
  }
}

.temp-txt{
  color: black;
  text-decoration: none;
}

.mobile-alert{
  font-family: 'Noto Sans', sans-serif;
  padding-top: 10%;
  padding-left: 10%;
  padding-right: 10%;
  background-color: #ececec;
}

  .mobile-temp{
    display: none;
  }

  *{
  margin: 0;
  padding: 0;
}

.p1{
  font-family: 'Ubuntu', sans-serif;
  font-size: 50px;
  text-align: center;
  margin-top: 20px;
}

.p2{
  font-family: 'Ubuntu', sans-serif;
  font-size: 23px;
  text-align: center;
  padding-top: 20px;
  padding-left: 2%;
  padding-right: 2%;
  line-height: 30px;
}

.titolo-inizio{
  font-family: 'Ubuntu', sans-serif;
  font-size: 23px;
  text-align: center;
  line-height: 30px;
}

.container{
  width: 100%;
  height: 100vh;
  background-repeat: no-repeat;
  padding-left: 3%;
  padding-right: 3%;
  box-sizing: border-box;
  background-size: cover;
  background-image: linear-gradient(rgba(0,0,0,0.8),rgba(0,0,0,0.8)),url('img/gianni-concert.jpg');
  color: #ececec; 
  background-position: center;
}

.row1{
  font-family: 'Ubuntu', sans-serif;
  display: flex;
  height: 88%;
  align-items: center;
}

.small-container{
  max-width: 1080px;
  margin: auto;
  padding-top: 3%;
  padding-left: 10%;
  padding-right: 10%;
}

.row{
  font-family: 'Ubuntu', sans-serif;
  display: flex;
  flex-direction: column;
  height: 88%;
  align-items: center;
}

.col{
  flex-basis: 50;
}

.col-4{
  text-align: center;
  padding: 10px;
  margin-bottom: 50px;
}

.col-4 img{
  margin-bottom: 5%;
  width: 55%;
}

.col-3{
  text-align: center;
  padding: 10px;
  margin-bottom: 50px;
}

.col-3 img{
  margin-bottom: 5%;
  width: 55%;
}

.moveup {
  position: relative;
  top: 0;
  transition: top ease 0.3s;
}

#app{
  font-family: 'Ubuntu', sans-serif;
  padding-top: 50px;
  background-color: #ececec;
}

.arrow{
  opacity: 0;
  height: 30px;
  animation: jump 2s infinite, fadein 4s;
}

@keyframes jump{
  0%{
    transform: translate(0, 0px);
    opacity: 1;
  }
  50%{
    transform: translate(0, 15px);
    opacity: 1;
  }
  100%{
    transform: translate(0, 0px);
    opacity: 1;
  }
}

@keyframes fadein{
  0%{
    opacity: 0;
  }
  90%{
    opacity: 0;
  }
  100%{
    opacity: 1;
  }
}



/* DOWNLOAD BUTTON */

.btn {
  font-size: 1em;
  line-height: 1em;
  letter-spacing: 0.04em;
  display: inline-block;
}
.btn--svg {
  position: relative;
  height: 42px;
  width: 190px;
  overflow: hidden;
  border-radius: 21px;
}
.btn--svg:hover .btn--svg__circle circle {
  transform: scale(0);
}
.btn--svg:hover .btn--svg__label {
  color: #fff;
}
.btn--svg:hover .btn--svg__border--left path,
.btn--svg:hover .btn--svg__border--right path {
  stroke-dasharray: 61.8204345703 61.8204345703;
  stroke-dashoffset: 0;
  -webkit-transition-delay: 0.25s;
  -webkit-transition-duration: 0.5s;
  -webkit-transition-timing-function: ease-in-out;
  -webkit-transition-property: stroke-dashoffset;
  -moz-transition-delay: 0.25s;
  -moz-transition-duration: 0.5s;
  -moz-transition-timing-function: ease-in-out;
  -moz-transition-property: stroke-dashoffset;
  -ms-transition-delay: 0.25s;
  -ms-transition-duration: 0.5s;
  -ms-transition-timing-function: ease-in-out;
  -ms-transition-property: stroke-dashoffset;
  transition-delay: 0.25s;
  transition-duration: 0.5s;
  transition-timing-function: ease-in-out;
  transition-property: stroke-dashoffset;
}
.btn--svg__label {
  -webkit-font-smoothing: antialiased;
  font-family: sans-serif;
  font-weight: bold;
  text-align: center;
  color: black;
  z-index: 3;
  width: 100%;
  transition: color 0.5s ease-in-out;
}
.btn--svg__circle circle {
  -webkit-transition: transform 0.5s ease-in-out;
  -webkit-transform: scale(1.1);
  -webkit-transform-origin: 50% 50%;
  -moz-transition: transform 0.5s ease-in-out;
  -moz-transform: scale(1.1);
  -moz-transform-origin: 50% 50%;
  -ms-transition: transform 0.5s ease-in-out;
  -ms-transform: scale(1.1);
  -ms-transform-origin: 50% 50%;
  transition: transform 0.5s ease-in-out;
  transform: scale(1.1);
  transform-origin: 50% 50%;
}
.btn--svg__border--left path, .btn--svg__border--right path {
  stroke-dasharray: 61.8204345703 61.8204345703;
  -webkit-transition-duration: 0s;
  -webkit-transition-timing-function: ease-in-out;
  -webkit-transition-property: stroke-dashoffset;
  -webkit-transition-delay: 0.5s;
  -moz-transition-duration: 0s;
  -moz-transition-timing-function: ease-in-out;
  -moz-transition-property: stroke-dashoffset;
  -moz-transition-delay: 0.5s;
  -ms-transition-duration: 0s;
  -ms-transition-timing-function: ease-in-out;
  -ms-transition-property: stroke-dashoffset;
  -ms-transition-delay: 0.5s;
  transition-duration: 0s;
  transition-timing-function: ease-in-out;
  transition-property: stroke-dashoffset;
  transition-delay: 0.5s;
}
.btn--svg__border--left path {
  stroke-dashoffset: -61.8204345703;
}
.btn--svg__border--right path {
  stroke-dashoffset: 61.8204345703;
}
.btn--svg svg, .btn--svg__label {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -webkit-transform-origin: 50% 50%;
  -moz-transform: translate(-50%, -50%);
  -moz-transform-origin: 50% 50%;
  -ms-transform: translate(-50%, -50%);
  -ms-transform-origin: 50% 50%;
  transform: translate(-50%, -50%);
  transform-origin: 50% 50%;
}

.c-white {
  color: white;
}

.trailer {
  margin-bottom: 40px;
}
.trailer--nano {
  margin-bottom: 10px;
}

.bottonefigo {
  position: relative;
  text-decoration: none;
}
.redcolor{
  color: red;
}
.bottonefigo:after {
  content: "";
  height: 1px;
  bottom: -4px;
  position: absolute;
  left: 5%;
  right: 95%;
  background: red;
  transition: right 0.25s ease-in-out;
}
.bottonefigo:hover:after {
  right: 5%;
}

.teasing-1,
.heading-2 {
  font-family: sans-serif;
  letter-spacing: 0.04em;
  -webkit-font-smoothing: antialiased;
}

.teasing-1 {
  font-size: 14px;
  line-height: 14px;
}

.heading-2 {
  font-weight: bold;
  font-size: 20px;
  line-height: 20px;
  text-transform: uppercase;
}

.dlimg{
  display: none;
}

#download{
  background: linear-gradient(rgba(0,0,0,0.8),rgba(0,0,0,0.8)),url('../img/logo.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  padding-top: 50px;
  font-family: 'Ubuntu', sans-serif;
  padding-bottom: 50px;
  width: 100%;
  height: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
}

.dl-h1{
  padding-bottom: 5%;
  padding-left: 10px;
  padding-right: 10px;
}

/*
.footer-proj{
  float: right;
  font-family: 'Ubuntu', sans-serif;
}

#footer{
  height: 100px;
  padding-top: 40px;
  padding-bottom: 30px;
  font-family: 'Ubuntu', sans-serif;
  font-size: 15px;
  background-color: #c2c2c2;
}
*/

.footer {
  background: #c2c2c2;
  color: #000000;
  height: 250px;
  position: relative;
  font-family: 'Ubuntu', sans-serif;
  overflow: hidden;
}

.footer .footer-content {
  height: 350px;
  display: flex;
  flex-direction: column;
}

.footer .footer-content .footer-section {
  flex: 1;
  padding: 25px;
}

.footer-logo{
  width: 30px;
  height: 30px;
  float: right;
}

.footer-ltd{
  padding-top: 30px;
  transform: translateY(-100px);
}
}