body {
margin: 0;
width: 100%;
height: 100vh;
/* background: linear-gradient(-45deg, #ffc0c0, #feffcd, #c9f1ff, #a8ffac); */
background: linear-gradient(-45deg, rgba(0, 226, 7, 0.1), rgba(219, 226, 0, 0.1), rgba(239, 77, 161, 0.1), rgba(76, 63, 181, .1));
background-size: 250% 250%;
animation: gradientBG 30s ease infinite;
background-color: #000;
}

@keyframes gradientBG {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}

#background {
-webkit-animation:20s multi_rotate linear infinite;
background: url(https://www.welcome.minimals.it/img/BG-TV.png);
width: 100%;
height: 100%;
background-size: cover;
}

@-webkit-keyframes multi_rotate {
0% {
-webkit-filter:hue-rotate(0deg);
}
100% {
-webkit-filter:hue-rotate(360deg);
}
}

#pulse {
-webkit-animation:8s effect_pulse linear infinite;
}

@-webkit-keyframes effect_pulse {
0% {
transform: scale(1);
}
50% {
transform: scale(1.08);
}
100% {
transform: scale(1);
}
}

/* #################################################################################
                                 LOGO
################################################################################# */

#logo {
position: absolute;
width: 140px;
padding: 35px;
z-index: 2;
}


/* #################################################################################
                                 BOX CLIENTE
################################################################################# */

#box-client {
height: 150px;
top: 50%;
position: absolute;
width: 100%;
margin-top: -75px;
font-weight: 400;
}

#field-benvenuto {
text-align: center;
font-size: 55px;
margin: 0px 0px 10px;
font-family: 'ProximaNova_Semibold';
width: 100%;
background: none;
border: none;
color: #fff;
outline: none
}

#field-name {
position: relative;
border: none;
font-size: 65px;
text-align: center;
width: 100%;
outline: none;
font-family: 'ProximaNova_Bold';
text-transform:uppercase;
background: transparent;
color:#fff;
}

/* #################################################################################
                             FONT PROXIMA NOVA
################################################################################# */

@font-face {
    font-family: 'ProximaNova_Semibold';
    src: url('../font/ProximaNova-Semibold-webfont.eot');
    src: url('../font/ProximaNova-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/ProximaNova-Semibold-webfont.woff2') format('woff2'),
         url('../font/ProximaNova-Semibold-webfont.woff') format('woff'),
         url('../font/ProximaNova-Semibold-webfont.ttf') format('truetype'),
         url('../font/ProximaNova-Semibold-webfont.svg#proxima_novasemibold') format('svg');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'ProximaNova_Regular';
    src: url('../font/ProximaNova-Regular-webfont.eot');
    src: url('../font/ProximaNova-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/ProximaNova-Regular-webfont.woff2') format('woff2'),
         url('../font/ProximaNova-Regular-webfont.woff') format('woff'),
         url('../font/ProximaNova-Regular-webfont.ttf') format('truetype'),
         url('../font/ProximaNova-Regular-webfont.svg#proxima_nova_rgregular') format('svg');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'ProximaNova_Light_Italic';
    src: url('../font/ProximaNova-Light-Italic-webfont.eot');
    src: url('../font/ProximaNova-Light-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/ProximaNova-Light-Italic-webfont.woff2') format('woff2'),
         url('../font/ProximaNova-Light-Italic-webfont.woff') format('woff'),
         url('../font/ProximaNova-Light-Italic-webfont.ttf') format('truetype'),
         url('../font/ProximaNova-Light-Italic-webfont.svg#proxima_novalight_italic') format('svg');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: 'ProximaNova_Light';
    src: url('../font/ProximaNova-Light-webfont.eot');
    src: url('../font/ProximaNova-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/ProximaNova-Light-webfont.woff2') format('woff2'),
         url('../font/ProximaNova-Light-webfont.woff') format('woff'),
         url('../font/ProximaNova-Light-webfont.ttf') format('truetype'),
         url('../font/ProximaNova-Light-webfont.svg#proxima_novalight') format('svg');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'ProximaNova_Semibold_Italic';
    src: url('../font/ProximaNova-Semibold-Italic-webfont.eot');
    src: url('../font/ProximaNova-Semibold-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/ProximaNova-Semibold-Italic-webfont.woff2') format('woff2'),
         url('../font/ProximaNova-Semibold-Italic-webfont.woff') format('woff'),
         url('../font/ProximaNova-Semibold-Italic-webfont.ttf') format('truetype'),
         url('../font/ProximaNova-Semibold-Italic-webfont.svg#proxima_novasemibold_italic') format('svg');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'ProximaNova_Bold_Italic';
    src: url('../font/ProximaNova-Bold-Italic-webfont.eot');
    src: url('../font/ProximaNova-Bold-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/ProximaNova-Bold-Italic-webfont.woff2') format('woff2'),
         url('../font/ProximaNova-Bold-Italic-webfont.woff') format('woff'),
         url('../font/ProximaNova-Bold-Italic-webfont.ttf') format('truetype'),
         url('../font/ProximaNova-Bold-Italic-webfont.svg#proxima_nova_rgbold_italic') format('svg');
    font-weight: 700;
    font-style: italic;
}

@font-face {
    font-family: 'ProximaNova_Black';
    src: url('../font/ProximaNova-Black-webfont.eot');
    src: url('../font/ProximaNova-Black-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/ProximaNova-Black-webfont.woff2') format('woff2'),
         url('../font/ProximaNova-Black-webfont.woff') format('woff'),
         url('../font/ProximaNova-Black-webfont.ttf') format('truetype'),
         url('../font/ProximaNova-Black-webfont.svg#proxima_novablack') format('svg');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'ProximaNova_Bold';
    src: url('../font/ProximaNova-Bold-webfont.eot');
    src: url('../font/ProximaNova-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/ProximaNova-Bold-webfont.woff2') format('woff2'),
         url('../font/ProximaNova-Bold-webfont.woff') format('woff'),
         url('../font/ProximaNova-Bold-webfont.ttf') format('truetype'),
         url('../font/ProximaNova-Bold-webfont.svg#proxima_nova_rgbold') format('svg');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'ProximaNova_Regular_Italic';
    src: url('../font/ProximaNova-Regular-Italic-webfont.eot');
    src: url('../font/ProximaNova-Regular-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/ProximaNova-Regular-Italic-webfont.woff2') format('woff2'),
         url('../font/ProximaNova-Regular-Italic-webfont.woff') format('woff'),
         url('../font/ProximaNova-Regular-Italic-webfont.ttf') format('truetype'),
         url('../font/ProximaNova-Regular-Italic-webfont.svg#proxima_novaregular_italic') format('svg');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'ProximaNova_Extrabold';
    src: url('../font/ProximaNova-Extrabold-webfont.eot');
    src: url('../font/ProximaNova-Extrabold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/ProximaNova-Extrabold-webfont.woff2') format('woff2'),
         url('../font/ProximaNova-Extrabold-webfont.woff') format('woff'),
         url('../font/ProximaNova-Extrabold-webfont.ttf') format('truetype'),
         url('../font/ProximaNova-Extrabold-webfont.svg#proxima_novaregular_italic') format('svg');
    font-weight: 800;
    font-style: normal;
}
