@font-face {
font-family: "Proxima Nova";
src: url("../fonts/3267CF_5_0.html");
src: url("../fonts/3267CF_5_0d41d.html?#iefix") format('eot'), url("../fonts/3267CF_5_0.woff2"), url("../fonts/3267CF_5_0-2.html"), url("../fonts/3267CF_5_0-3.html");
font-weight: 600;
}
@font-face {
font-family: "Proxima Nova";
src: url("../fonts/3267CF_B_0.html");
src: url("../fonts/3267CF_B_0d41d.html?#iefix") format('eot'), url("../fonts/3267CF_B_0.woff2"), url("../fonts/3267CF_B_0-2.html"), url("../fonts/3267CF_B_0-3.html");
font-weight: 400;
}
@font-face {
font-family: "proxima_nova_rgregular";
font-style: normal;
font-weight: normal;
src: url("../fonts/proximanova-reg-webfont.woff2") format("woff2"), url("../fonts/proximanova-reg-webfont.woff") format("woff");
}
@font-face {
font-family: "proxima_novalight";
font-style: normal;
font-weight: normal;
src: url("../fonts/proximanova-light-webfont.woff2") format("woff2"), url("../fonts/proximanova-light-webfont.woff") format("woff");
}

#svg {

}
a:hover {
    color: #0cf40c;
}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
nav ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
a {
	margin: 0;
	padding: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
	text-decoration:none
}
ins {
	background-color: #72a95e;
	color: #000;
	text-decoration: none;
}
mark {
	background-color: #72a95e;
	color: #000;
	font-style: italic;
	font-weight: bold;
}
del {
	text-decoration: line-through;
}
abbr[title], dfn[title] {
	border-bottom: 1px dotted;
	cursor: help;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

hr {
    
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid #72a95e;
	margin: 1em 0;
	padding: 0;
}
hr .mid{
    width: 50%;
	
}
input, select {
	vertical-align: middle;
}
h4 {
    margin: 2vh;
    font-size: 2vh;
    font-size: 1.7vh;
    font-weight: normal;
    text-align: left;
}
h3 {
    font-family: 'proxima_novalight';
    letter-spacing: 6px;
    text-indent: 3px;
    font-size: 4vh;
    font-weight: normal;
    text-align: left;
}
.serviziBanner {
    margin-bottom: 5vh;
    margin-top: 5vh;
    border: 10px solid #72a95e;
    padding: 2vh;
    background-color: #00000080;
    box-shadow: 0px 15px 38px -3px rgba(0,0,0,0.6);
    color: white;
    font-size: 3vh;
}
.serviziTitle {
font-size:4vh;
padding:2vh;
text-align:center;

}
section#servizi {
    background: rgba(0,0,0,0.4);
    position: relative;
}
 h6 {
    font-family: 'proxima_novalight';
    color: #72a95e;
    font-size: 2vh;
    font-weight: normal;
}
 h5 {
    letter-spacing: 0.2em;
    font-family: 'proxima_novalight';
    color:white;
    font-size: 3.5vh;
    font-weight: normal;
}
 .wow.col-md-2 {
    margin-left: 50%;
}


/*/STYLE/*/
html, body {
/*height: 100%;*/
width: 100%;
background: url(../img/background2.jpg);
font-size: 79.06%;
font-family: 'proxima_novalight';
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-moz-font-feature-settings: "liga", "kern";
text-rendering: optimizelegibility;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}

.hide-menu {
    margin-left:-500px!important;
}
.hide-menu.show {
    margin-left:0px!important;
    transition: ease-out 0.3s all;
-webkit-transition: ease-out 0.3s all;
}

* {
box-sizing: border-box;
}

a {
color: inherit;
transition: all ease-out 0.3s;
-webkit-transition: all ease-out 0.3s;
}
/*LOADER*/
#loader {
width: 100%;
height: 2000vh;
position: absolute;
background-color: black;
z-index: 9999;
left: 0;
top: 0;
}

#loader.remove {
transform: translateY(-4000px);
-webkit-transition: all 1000ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
-moz-transition: all 1600ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
-o-transition: all 1600ms cubic-bezier(0.420, 0.000, 1.000, 1.000);
transition: all 1600ms cubic-bezier(0.420, 0.000, 1.000, 1.000); /* ease-in */
-webkit-transition-timing-function: cubic-bezier(0.420, 0.000, 1.000, 1.000);
-moz-transition-timing-function: cubic-bezier(0.420, 0.000, 1.000, 1.000);
-o-transition-timing-function: cubic-bezier(0.420, 0.000, 1.000, 1.000);
transition-timing-function: cubic-bezier(0.420, 0.000, 1.000, 1.000); /* ease-in */
}

section {
position: relative;
width: 100%;
min-height: 100%;
}

section em {
position: absolute;
bottom: 0;
}

header {
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 99;
transition: background ease-in 0.3, width ease 0.1s 0.3s;
-webkit-transition: background ease-in 0.3s, width ease 0.1s 0.3s;
width: 20px;
}

header.op {
width: 100%;
background: rgba(0,0,0,0.7);
transition: background ease-in 0.3s 0.1s, width ease 0.1s;
-webkit-transition: background ease-in 0.3s 0.1s, width ease 0.1s;
}

header .bt-menu {
position: absolute;
width: 54px;
height: 54px;
background: rgba(255,255,255,0.05);
cursor: pointer;
z-index: 3;
top: 20px;
left: 23px;
transition: all ease-out 0.3s;
-webkit-transition: all ease-out 0.3s;
}

header .bt-menu i {
width: 20px;
height: 1px;
background: #6ecc87;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
transition: all ease-out 0.3s;
-webkit-transition: all ease-out 0.3s;
}

header .bt-menu i:first-child {
margin-top: -5px;
}

header .bt-menu i:last-child {
margin-top: 5px;
}

header .bt-menu.open {
background: #FFF;
}

header .bt-menu.open i {
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
left: 33%;
}

header .bt-menu.open i:first-child {
transform: rotate(135deg);
-webkit-transform: rotate(135deg);
margin-top: 0;
}

header .bt-menu.open i:last-child {
display: none;
}

nav {
width: 250px;
height: 100%;
position: fixed;
background: rgba(120, 181, 97, 0.89);
color: #FFF;
left: -400px;
}

nav i {
width: 50px;
height: 100%;
position: absolute;
z-index: 0;
background: #337339;
}

nav ul {
position: relative;
z-index: 1;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
top: 50%;
}

nav li:first-child {
margin-top: 0;
}

nav li {
height: 50px;
position: relative;
padding-left: 50px;
margin-top: 60px;
}

nav li a {
text-transform: uppercase;
font-size: 1.8em;
display: block;
line-height: 50px;
padding-left: 3px;
letter-spacing: 4px;
opacity: 0;
font-family: 'Proxima Nova';
}

nav li span {
position: absolute;
width: 50px;
height: 25px;
color: #000;
opacity: 0.1;
font-size: 3.5em;
font-family: 'Proxima Nova';
overflow: hidden;
letter-spacing: 0.1em;
text-align: center;
top: 13px;
left: 13px;
transition: all ease-out 0.3s;
-webkit-transition: all ease-out 0.3s;
transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
opacity: 0;
}

nav li.view a {
opacity: 1;
padding-left: 25px;
}

nav li.view span {
opacity: 0.1;
}

nav li.active > span {
opacity: 0.25;
}

nav li.active > a {
color: #000;
border-left: 2px solid black;
}

#navScroll {
height: calc(100% - 74px);
position: fixed;
color: #FFF;
z-index: 98;
top: 74px;
}

#navScroll i {
width: 50px;
height: 100%;
position: absolute;
z-index: 0;
border-right: 1px solid rgba(255,255,255,0.3);
}

#navScroll li {
max-height: 150px;
min-height: 50px;
position: relative;
padding-left: 50px;
margin-top: 15px;
height: 17%;
}

#navScroll li:first-child {
margin-top: 0;
}

#navScroll li a {
padding: 20px;
left: 49px;
top: 0;
font-size: 1.4em;
display: block;
height: 100%;
padding-left: 3px;
font-family: 'Proxima Nova';
position: absolute;
/*border-left: 1px solid rgba(255,255,255,0.8);*/
}

#navScroll li a strong {
font-size: 1.3em;
letter-spacing: 0.4em;
font-family: 'Proxima Nova';
font-weight: normal;
position: absolute;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
opacity: 0;
transition: all ease-out 0.3s;
-webkit-transition: all ease-out 0.3s;
}

#navScroll li span {
position: absolute;
width: 50px;
height: 25px;
color: #6ecc87;
opacity: 0;
font-size: 3.5em;
font-family: 'Proxima Nova';
overflow: hidden;
letter-spacing: 0.1em;
text-align: center;
top: 50%;
margin-top: -2px;
left: 13px;
transition: all ease-out 0.3s;
-webkit-transition: all ease-out 0.3s;
transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
}

#navScroll li em {
position: absolute;
left: 49px;
top: 0px;
width: 2px;
background: #6ecc87;
opacity: 0;
z-index: 3;
max-height: 100% !important;
height: 0;
transition: height, opacity ease-out 0.3s;
-webkit-transition: height, opacity ease-out 0.3s;
-moz-top: 0;
}

#navScroll li.active em {
opacity: 1;
}

#navScroll li.active a {
padding-left: 23px;
}

#navScroll li.active a strong {
opacity: 1;
}

#navScroll li.active span {
opacity: 0.2;
}

section {
transition: all ease-in 0.3s;
-webkit-transition: all 300ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
-moz-transition: all 300ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
-o-transition: all 300ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
transition: all 300ms cubic-bezier(0.165, 0.840, 0.440, 1.000); /* easeOutQuart */
}

#home .wp {
width: 100%;
max-width: 970px;
position: relative;
z-index: 3;
margin: auto;
padding: 8% 60px;
transition: ease-out 0.5s all;
-webkit-transition: ease-out 0.5s all;
}

#home .logo {
width: 180px;
position: relative;
height: 125px;
left: -50px;
}

#home .logo span {
position: absolute;
right: 25px;
bottom: 0;
color: #FFF;
font-size: 0.8em;
text-transform: uppercase;
letter-spacing: 0.2em;
}

#home h1 {
overflow: hidden;
border-left: 0.2px solid white;
padding: 20px;
font-size: 2.5em;
color: #FFF;
opacity:0;
font-weight: normal;
line-height: 1.8;
margin: 150px 0;
text-transform: uppercase;
letter-spacing: 1.5vh;
transition: all 600ms 0.2s ease;
-webkit-transition: all 600ms 0.2s ease;
-moz-transition: all 600ms 0.2s ease;
-o-transition: all 600ms 0.2s ease;
-ms-transition: all 600ms 0.2s ease;
}

.bt-ancla {
display: inline-block;
padding-left: 45px;
position: relative;
line-height: 80px;
font-size: 1.2em;
color: rgba(255,255,255,0.2);
text-transform: uppercase;
letter-spacing: 0.2em;
}

.bt-ancla img {
position: absolute;
left: 0;
top: 0;
transition: top ease-out 0.3s;
-webkit-transition: top ease-out 0.3s;
}

.blackstuff {
    opacity:0;
transform: translateY(2000px);
transition: all 600ms 0.2s ease;
-webkit-transition: all 600ms 0.2s ease;
-moz-transition: all 600ms 0.2s ease;
-o-transition: all 600ms 0.2s ease;
-ms-transition: all 600ms 0.2s ease;
}
.blackstuff.show {
     opacity:1;
transform: translateY(2000px);
transition: all 600ms 0.2s ease;
-webkit-transition: all 600ms 0.2s ease;
-moz-transition: all 600ms 0.2s ease;
-o-transition: all 600ms 0.2s ease;
-ms-transition: all 600ms 0.2s ease;
}

#home img {
margin-bottom: 20px;
max-width: 700px;
position: absolute;
z-index: 0;
transition: ease-out 0.3s all;
-webkit-transition: ease-out 0.3s all;
}

#home .basilico {
width: 150px;
top: -300px;
left: 40%;
opacity: 0;
filter: alpha(opacity=0);
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
-webkit-backface-visibility: hidden;
}

#home .basilico.show {
left: 0;
right: 0;
margin: auto;
top: 20px;
transition: ease-out 0.3s all;
-webkit-transition: ease-out 0.3s all;
opacity: 0.95;
filter: alpha(opacity=95);
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=95)";
-webkit-backface-visibility: hidden;
}

#home .tomato {
top: 60%;
left: 40%;
}

#home .blacksomething {
bottom: 40px;
left: 300px;
}

#home .romero {
top: 80px;
left: 65%;
}

#home .destapa {
bottom: 50px;
left: 80%;
}

#home .tomato {
margin: auto;
left: 0;
right: 0;
bottom: 0%;
transform: translateY(2000px);
}

#home .espatula {
top: 0;
left: 10%;
}

#home .salad {
max-width: 47%;
z-index: 4;
transform: translateX(2000px);
/*transition: all 600ms 0.2s ease;
-webkit-transition: all 600ms 0.2s ease;
-moz-transition: all 600ms 0.2s ease;
-o-transition: all 600ms 0.2s ease;
-ms-transition: all 600ms 0.2s ease;*/
margin-top: 6rem;
top: 0;
left: 50%;
}

#home .vx {
transition: ease-out 0.3s all;
-webkit-transition: ease-out 0.3s all;
}

#home .basilico.vx {
-webkit-filter: blur(10px);
filter: blur(10px);
left: 90%;
}

#home .salad.vx {
-webkit-filter: blur(10px);
filter: blur(10px);
bottom: -200px;
}

#home .espatula.vx {
top: -300px;
}

#storia .copy {
border: 0.1px solid #fff6;
max-width: 700px;
padding: 150px 70px 0;
position: relative;
margin: auto;

text-align: center;
transition: ease-out 0.5s all;
-webkit-transition: ease-out 0.5s all;
-webkit-box-shadow: 0px 15px 38px -3px rgba(0,0,0,0.6);
-moz-box-shadow: 0px 15px 38px -3px rgba(0,0,0,0.6);
box-shadow: 0px 15px 38px -3px rgba(0,0,0,0.6);
}

#storia .copy p {
text-align: justify;
margin: 20px 0;
font-size: 2.5vh;
color: #848383;
line-height: 1.5;
position: relative;
}

#storia .copy h2 {
text-transform: uppercase;
color: #FFF;
font-weight: normal;
font-size: 4vh;
letter-spacing: 0.5vh;
}

#storia .copy hr {
width: 100%;
margin: 30px auto;
border: none;
height: 0.8px;
background: #6ecc87;
}

#storia .firma {
display: block;
margin: auto;
width: 250px;
position: relative;
font-size: 1.5em;
}

#storia .firma h4 {
color: #FFF;
font-family: 'Proxima Nova-b';
position: absolute;
z-index: 1;
top: 10px;
left: 0;
}

#storia .firma svg {
width: 100%;
stroke: #5a5a5a;
stroke-width: 1px;
stroke-dasharray: 0, 1087;
transition: ease-in 2.5s all;
-webkit-transition: ease-in 2.5s all;
width: 100%;
}

#storia .firma.view svg {
stroke-dasharray: 1087, 0;
}

#piatti .video {
position: relative;
z-index: 2;
}

#piatti .wp {
width: 970px;
padding: 0 60px;
position: relative;
margin: auto;
height: 100%;
z-index: 2;
}

#piatti .sobrinos {
position: relative;
padding-bottom: 100px;
padding-top: 1px;
overflow: hidden;
}

#piatti .sobrinos .wp {
margin: 285px auto 80px;
}

#piatti .sobrinos .px {
position: relative;
transition: top ease-out 0.3s;
-webkit-transition: top ease-out 0.3s;
}

#piatti .sobrinos h2 {
font-size: 3.3em;
color: #FFF;
font-weight: normal;
line-height: 1.8;
text-transform: uppercase;
letter-spacing: 0.4em;
}

#piatti .sobrinos img {
position: absolute;
z-index: 0;
transition: top ease-out 0.3s;
-webkit-transition: top ease-out 0.3s;
}

#piatti .sobrinos .pimienta {
top: 40%;
left: 5%;
}

#piatti .sobrinos .pimienta2 {
bottom: 100px;
left: 50%;
}

#piatti .sobrinos .panceta {
top: 450px;
left: 0%;
}

#piatti .sobrinos .plato {
top: -100px;
left: 15%;
}

#storia .sobrinos .perejil {
top: 100px;
left: 52%;
}

#piatti .sobrinos .cuchillo {
top: 240px;
left: 60%;
}

#piatti .sobrinos .tenedor {
top: 500px;
left: 85%;
}

#piatti .sobrinos .ajo {
bottom: 50px;
left: 70%;
}

#piatti .fotos {
background: rgba(0,0,0,0.4);
height: 1100px;
overflow: hidden;
}

#piatti .fotos img {
position: absolute;
transition: top ease-out 0.3s;
-webkit-transition: top ease-out 0.3s;
}

#piatti .fotos img.img-1 {
top: 0px;
left: -100px;
z-index: 5;
}

#piatti .fotos img.img-2 {
left: 50%;
transform: translateX(-40%);
-webkit-transform: translateX(-40%);
z-index: 8;
}

#piatti .fotos img.img-3 {
right: -50px;
z-index: 2;
}

#piatti .fotos img.img-4 {
left: -50px;
z-index: 2;
}

#piatti .fotos img.img-5 {
right: -80px;
z-index: 6;
}

#piatti .fotos img.img-6 {
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
z-index: 5;
}

#piatti .lo_mejor {
background: rgba(0,0,0,0.4);
position: relative;
}

#piatti .lo_mejor .copy {
max-width: 700px;
position: relative;
margin: auto;
text-align: center;
z-index: 9;
transition: top ease-out 0.3s;
-webkit-transition: top ease-out 0.3s;
}

#piatti .lo_mejor .copy p {
max-width: 300px;
margin: 20px auto;
font-size: 2em;
color: #848383;
line-height: 1.5;
}

#piatti .lo_mejor .copy h2 {
color: #FFF;
font-weight: normal;
font-size: 3.5em;
font-family: 'clicheregular';
}

#piatti .lo_mejor .copy hr {
width: 120px;
margin: 30px auto;
border: none;
height: 1px;
background: #6ecc87;
}
/*#piatti .lo_mejor .bt-ancla{display:block;padding-left:0;position:relative;line-height:60px;font-size:1.2em;color:#1f1f1f;text-transform:uppercase;letter-spacing:0.3em;text-align:center;max-width:320px;margin:auto;margin-top:20px;background:#6ecc87 url(../img/ar-bt-pedi.png) 30px center no-repeat;font-family: 'Proxima Nova-m';top:80px;z-index:2}*/
#piatti .lo_mejor img {
position: absolute;
transition: top ease-out 0.3s;
-webkit-transition: top ease-out 0.3s;
}

#piatti .lo_mejor img.figaza {
left: 8%;
top: 0;
}

#piatti .lo_mejor img.rodajas {
left: 15%;
top: 300px;
}

#piatti .lo_mejor img.frances {
left: 75%;
top: 200px;
}

#piatti .lo_mejor img.pimienta {
left: 75%;
top: 220px;
}

#piatti .lo_mejor img.pimienta2 {
left: 30%;
top: 400px;
}

#piatti .lo_mejor img.cucharon {
position: relative;
display: block;
margin: auto;
}

#servizi .copy {
max-width: 1100px;
position: relative;
margin: auto;
text-align: center;
transition: ease-out 0.5s all;
-webkit-transition: ease-out 0.5s all;
top: 250px;
}

#servizi .copy h2 {
color: #FFF;
font-weight: normal;
font-size: 3.5em;
}

#servizi .copy hr {
width: 120px;
margin: 30px auto;
border: none;
height: 1px;
background: #6ecc87;
}

#servizi .copy label {
display: inline-block;
height: 80px;
line-height: 80px;
color: #848383;
font-size: 1.5em;
margin-bottom: 10px;
}

#servizi .copy label div.input {
display: inline-block;
height: 80px;
position: relative;
background: #383838;
margin: 0 10px;
line-height: 1;
}

#servizi .copy label div.input.error {
border: 3px solid #6ecc87;
border-radius: 4px;
}

#servizi .copy label div.input.error input {
color: #6ecc87;
}

#servizi .copy label div.input.s {
width: 100px;
}

#servizi .copy label div.input.l {
width: 250px;
}

#servizi .copy label div.input.lc {
width: 320px;
}

#servizi .copy label div.input.xl {
width: 500px;
}

#servizi .copy label div.input ul {
position: absolute;
top: 80px;
width: 100%;
max-height: 240px;
background: #383838;
z-index: 99;
}

#servizi .copy label div.input ul li {
list-style: none;
display: block;
line-height: 2;
font-size: 1.5em;
cursor: pointer;
transition: all ease-in 0.3s;
-webkit-transition: all ease-in 0.3s;
text-transform: capitalize;
}

.slimScrollDiv {
width: 100% !important;
}

#servizi .copy label div.input input {
position: relative;
top: 0;
left: 0;
height: 100%;
width: 100%;
color: #FFF;
font-size: 1.8em;
text-align: center;
border: none;
background: none;
margin: 0;
font-family: 'Proxima Nova-l';
outline: none;
-webkit-appearance: none;
z-index: 0;
cursor: pointer;
z-index: 2;
text-indent: -20px;
}

#servizi .copy label div.input:before {
content: '';
position: absolute;
width: 10px;
height: 10px;
top: 50%;
right: 15px;
z-index: 1;
background: url(../img/arrow-down-golden.html) no-repeat center;
margin-top: -5px;
}

#servizi .copy label div.input.mail:before {
display: none;
}

#servizi .copy label div.input.date input {
z-index: 3;
cursor: pointer;
}

#servizi button {
display: block;
padding-left: 0;
position: relative;
line-height: 60px;
font-size: 1.2em;
color: #1f1f1f;
text-transform: uppercase;
letter-spacing: 0.3em;
text-align: center;
width: 180px;
margin: auto;
margin-top: 20px;
background: #6ecc87;
font-family: 'Proxima Nova-m';
top: 80px;
z-index: 2;
border: none;
cursor: pointer;
outline: none;
overflow: hidden;
transition: all ease-out 0.3s;
-webkit-transition: all ease-out 0.3s;
}

#servizi button img {
transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
position: absolute;
left: 150px;
top: 50%;
margin-top: -3px;
}

#servizi img.arrollado {
left: 50%;
top: 0;
position: absolute;
transition: top ease-out 0.3s;
-webkit-transition: top ease-out 0.3s;
}

#thanks {
font-size: 1.5em;
color: #848383;
text-align: center;
display: none;
padding: 20px;
clear: both;
top: 80px;
position: relative;
line-height: 1.2;
}

.container {
margin-top: 5%;
}

#contatti {
margin-top: 15px;
height: 700px;
}

/*Footer*/
footer {
position: absolute;
height: 125px;
padding: 30px 0;
width: 100%;
bottom: 10px;
left: 0;
}

footer .wp {
width: 100%;
max-width: 1200px;
color: #aaa;
font-size: 13px;
padding: 0 40px;
margin: auto;
}

footer .nk {
font-weight: 700;
opacity: .5;
float: right;
transition: all .3s;
-webkit-transition: all .3s;
}

footer .nk div {
position: relative;
display: inline-block;
vertical-align: middle;
transition: all .3s;
-webkit-transition: all .3s;
margin-left: 10px;
}

footer .nk div img {
transition: all .3s;
}

footer .nk div img:last-child {
position: absolute;
top: 0;
left: 0;
opacity: 0;
transform: scale(0);
}

footer .logo-foot,
footer p {
float: left;
}

footer p {
line-height: 80px;
padding-left: 15px;
}

footer p a.mail {
color: #FFF;
border-bottom: 1px solid #ba9565;
}

footer p strong {
color: #ba9565;
font-size: 20px;
margin: 0 10px;
}

footer p a.fb {
position: relative;
}

footer p a.fb img.w {
position: relative;
top: 4px;
margin-left: 8px;
}

footer p a.fb img.g {
position: absolute;
right: 0px;
top: 0;
transition: all ease-out 0.3s;
-webkit-transition: all ease-out 0.3s;
opacity: 0;
z-index: 1;
}
/*//////////////////extra/*/
img.bannerlogo {
opacity: 0;
left: 100px;
width: 70%;
position: relative;
left: 0;
right: 0;
margin: auto;
transition: ease-out 0.5s all;
-webkit-transition: ease-out 0.5s all;
}

img.bannerlogo.show {
opacity: 1;
transition: ease-out 2s all;
-webkit-transition: ease-out 2s all;
}

nav li.view a:hover {
margin-left: 30px;
}

section#storia {
background: rgba(0,0,0,0.4);
position: relative;
}

#border-top {
    opacity:0;
position: fixed;
left: 10px;
right: 10px;
top: 0;
height: 10px;
background: rgba(255, 255, 255, 0.2);
z-index: 20;
}

#border-bottom {
    opacity:0;
position: fixed;
left: 10px;
right: 10px;
bottom: 0;
height: 10px;
background: rgba(255, 255, 255, 0.2);
z-index: 20;
}

#border-left {
    opacity:0;
position: fixed;
left: 0;
bottom: 0;
width: 10px;
height: 100%;
background: rgba(255, 255, 255, 0.2);
z-index: 20;
}

#border-right {
opacity:0;
position: fixed;
right: 0;
bottom: 0;
width: 10px;
height: 100%;
background: rgba(255, 255, 255, 0.2);
z-index: 20;
}

img.bannerlogo {
top: 90px;
}

.coti {
height: 400px;
}

/*#home {
border: 2px solid lightgreen;
}

section#storia {
border: 2px solid red;
}*/

section#piatti {
height: 700px;
overflow: hidden;
width: 100%;
}

/*section#servizi {
border: 2px solid yellow;
}

section#contatti {
border: 2px solid blue;
}*/

.ciao {
transform: translateX(-2000px);
transition: all ease-out 0.5s;
-webkit-transition: all ease-out 0.5s;
}



.piattiTitle1 > h3 {
transform: translateX(-2000px);
font-size: 1.6em;
color: #FFF;
font-weight: normal;
line-height: 1.8;
/*margin-top: 10%;*/
text-transform: uppercase;
letter-spacing: 0.4em;
}

.piattiTitle1 > h3.active {
transform: translateX(0);
transition: all ease-out 0.5s;
-webkit-transition: all ease-out 0.5s;
}

.foodPhoto {
margin: 50% 20% 0% 32%;
transform: translateX(2000px);
transition: all ease-out 0.6s;
-webkit-transition: all ease-out 0.6s;
}

.foodPhoto.active {
transform: translateX(0);
transition: all 600ms 0.2s ease;
-webkit-transition: all 600ms 0.2s ease;
-moz-transition: all 600ms 0.2s ease;
-o-transition: all 600ms 0.2s ease;
-ms-transition: all 600ms 0.2s ease;
}

img.arrw {
    display: none;
    opacity:0;
    left: 0;
    right: 0;
    margin: auto;
    transition: all 600ms 0.9s ease;
-webkit-transition: all 600ms 0.9s ease;
-moz-transition: all 600ms 0.9s ease;
-o-transition: all 600ms 0.9s ease;
-ms-transition: all 600ms 0.9s ease;
    bottom: 0;
}
img.arrw.show {
    opacity:1;
    transition: all 600ms 0.9s ease;
-webkit-transition: all 600ms 0.9s ease;
-moz-transition: all 600ms 0.9s ease;
-o-transition: all 600ms 0.9s ease;
-ms-transition: all 600ms 0.9s ease;

}

.piattiTitle1 > h4 {
transform: translateX(-2000px);
font-size: 2.3em;
margin-top: 5%;
color: #FFF;
line-height: 1.8;
text-transform: uppercase;
font-weight: 200;
letter-spacing: 0.4em;
}

.piattiTitle1 > h4.active {
transform: translateX(0);
transition: all 600ms 0.2s ease;
-webkit-transition: all 600ms 0.2s ease;
-moz-transition: all 600ms 0.2s ease;
-o-transition: all 600ms 0.2s ease;
-ms-transition: all 600ms 0.2s ease;
}

hr.style-two {
border: 0;
height: 1px;
background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}

pageTitle {

margin-top: 25%;
margin-left: 20%;
}

.piattiTitle1 {
margin-top: 50%;
border-left: 1px solid #6ba257;
padding: 20px;
width: 100%;
margin-left: 0;
opacity: 1;
transition: all 600ms 0.2s ease;
-webkit-transition: all 600ms 0.2s ease;
-moz-transition: all 600ms 0.2s ease;
-o-transition: all 600ms 0.2s ease;
-ms-transition: all 600ms 0.2s ease;
}

.item {
top: 10%;
bottom: 10%;
margin: auto;
left: 10%;
right: 10%;
overflow: hidden;
position: absolute;
  
}

.wow.col-md-2 {
top: 50%;
margin: auto;
position: absolute;
}

.item.active {
margin-left: 0;
}

.slide {
margin-left: 40%;
transform: translateX(2000px);
transition: all ease-out 0.9s;
-webkit-transition: all ease-out 0.9s;
}

.slide.active {
transform: translateX(0);
transition: all 600ms 0.9s ease;
-webkit-transition: all 600ms 0.9s ease;
-moz-transition: all 600ms 0.9s ease;
-o-transition: all 600ms 0.9s ease;
-ms-transition: all 600ms 0.9s ease;
}
/*//////////////////////SVG*/
.wow.col-md-2 {
cursor: pointer;
left: 0;
right: 0;
}

img#foto_one {
border: 2.5px solid #72a95e;
}
img#foto_two {
border: 2.5px solid white;
}
img#foto_tree {
border: 2.5px solid #72a95e;
}
img#foto_four {
border: 2.5px solid white;
}

@-webkit-keyframes arrow-jump {
  0%   { opacity: 0;}
  100% { opacity: 1; 
        -webkit-transform: translateY(15px);
        -moz-transform: translateY(15px);
        -o-transform: translateY(15px);
        transform: translateY(15px);
    }
  
}
#arrw {
    -webkit-animation: arrow-jump 1s infinite; /* Safari 4+ */
    -moz-animation: arrow-jump 1s infinite; /* Fx 5+ */
    -o-animation: arrow-jump 1s infinite; /* Opera 12+ */
    animation: arrow-jump 1s infinite; /* IE 10+, Fx 29+ */
}

@-webkit-keyframes arrow-right {
  0%   { opacity: 0;}
  100% { opacity: 1; 
        -webkit-transform: translateX(20px);
        -moz-transform: translateX(20px);
        -o-transform: translateX(20px);
        transform: translateX(20px);
    }
  
}
.slide.active {
    -webkit-animation: arrow-right 1s infinite; /* Safari 4+ */
    -moz-animation: arrow-right 1s infinite; /* Fx 5+ */
    -o-animation: arrow-right 1s infinite; /* Opera 12+ */
    animation: arrow-right 1s infinite; /* IE 10+, Fx 29+ */
}



/*//////////////////////////////////////////////////////////////////////////////////////media/////////////////*/
@media (min-width:1100px) {
nav li:hover > span {
opacity: 0.25;
}

nav li:hover > a {
color: #000;
}

header .bt-menu:hover {
background: #FFF;
}

header .bt-menu.open:hover {
background: #4f4f4f;
}

.bt-ancla:hover {
color: #FFF;
}

.bt-ancla:hover img {
animation: arrowHome 1s 1;
}

#servizi .copy label div.input ul li:hover {
background: #4f4f4f;
color: #FFF;
}

footer .nk:hover div img:first-child {
opacity: 0;
transform: scale(0);
}

footer .nk:hover div img:last-child {
opacity: 1;
transform: scale(1);
}

footer .nk:hover {
color: #ff5859;
font-weight: 700;
opacity: 1;
}

#video-controls:hover {
opacity: 1;
}

#servizi button:hover {
background: #FFF;
color: #6ecc87;
}

#servizi button:hover img {
animation: arrowForm 0.5s 1;
}

#contatti .copy p a:hover,
footer a.mail:hover,
footer a.fb:hover {
color: #6ecc87;
}

footer a.fb:hover > img.g {
opacity: 1;
}
}

@keyframes arrowHome {
0% {
top: 0px;
}

25% {
top: -10px;
}

50% {
top: 20px;
}

75% {
top: -10px;
}

100% {
top: 0px;
}
}

@keyframes arrowForm {
0% {
left: 150px;
}

45% {
left: 200px;
}

46% {
left: 200px;
display: none;
}

47% {
left: -15px;
display: block;
}

100% {
left: 150px;
}
}

@media (max-width:1024px) {
#home .logo {
left: 0;
}

footer .wp {
width: 90%;
}

footer p {
display: none;
}

#video-controls {
opacity: 1;
}
}

@media (max-width:960px) {
.foodPhoto {
margin-left:0;
}
#loader .num {
left: -20px;
}

#loader i {
left: 43px;
}

#navScroll {
z-index: -1;
opacity: 0;
}
/*1*/
#home .basilico {
/*width: 90%;
top: 80px;*/
}
/*2*/
#storia .copy {
top: 0;
padding: 50px;
}

#storia .firma svg {
stroke-dasharray: 1087, 0;
}
/*3*/
#piatti .sobrinos .wp {
margin: 90px auto;
}

#piatti .sobrinos .plato {
top: auto;
bottom: 190px;
left: 5%;
}

#piatti .sobrinos .cuchillo {
top: -170px;
left: 60%;
}

#piatti .sobrinos .tenedor,
#piatti .sobrinos .panceta {
display: none;
}

#storia .sobrinos .perejil {
left: auto;
right: 6%;
}
/*4*/
#piatti .wp {
width: 100%;
}

#piatti .fotos {
height: auto;
}

#piatti .fotos img {
display: block;
position: static;
max-width: 100%;
margin: auto;
transform: translateX(0%) !important;
-webkit-transform: translateX(0%) !important;
}

#piatti .lo_mejor img.figaza {
left: -110px;
}

#piatti .lo_mejor img.rodajas {
left: 0;
}

#piatti .lo_mejor .copy {
padding: 130px 0;
}

#piatti .lo_mejor img.pimienta2, #piatti .lo_mejor img.cucharon {
display: none;
}
/*5*/
#servizi .copy {
padding: 80px 0;
top: 0;
}

#servizi img.arrollado {
display: none;
}
/*6*/
#contatti {
margin-top: 80px;
}

#contatti .copy {
margin-top: -40px;
}

#contatti .copy p {
font-size: 2.5em;
}

#contatti .copy hr {
margin: 20px auto;
}
/*footer*/
footer .nk {
display: none;
}

footer .logo-foot {
display: block;
text-align: center;
float: none;
}
}

@media (max-width:640px) {
img.blackstuff.hidden-lg-down {
margin-top: -90px;
width: 150px;
}
section#piatti {
    height: 900px;
    overflow: hidden;
    width: 100%;
}
.foodPhoto {
margin-left: 0px;
}
#home .wp {
padding: 100px 40px;
}

#home .basilico, #home .pimienta-2 {
width: 20%;
}

#home .espatula,
#home .romero,
#home .destapa,
#home .tomato {
display: none;
}

#home .basilico {
width: 31%;
top: -35px;
/* left: 62%; */
}

#home .logo {
width: 130px;
height: 120px;
background-image: url("img/logwhite.html");
}

#home .logo span {
right: 10px;
}

#home h1 {
margin: 80px auto;
font-size: 1.8em;
}

#home .salad {
width: 223px;
bottom: -51px;
}
/*2*/
#storia .copy {
padding: 50px 20px;
}

#storia .copy h2 {
max-width: 230px;
margin: auto;
}

#storia .copy p {
font-size: 1.6em;
}
/*3*/
#video-controls {
width: 95%;
left: 52%;
}

#piatti .wp {
padding: 0 40px;
}

#piatti .sobrinos h2 {
font-size: 1.8em;
}

#piatti .sobrinos .plato {
bottom: auto;
width: 350px;
top: -290px;
}

#piatti .sobrinos .cuchillo,
#piatti .sobrinos .tenedor {
display: none;
}

#storia .sobrinos .perejil {
width: 120px;
}

#piatti .sobrinos .pimienta {
display: none;
}

#piatti .sobrinos .pimienta2 {
width: 66px;
left: 20%;
}

#piatti .sobrinos .ajo {
width: 80px;
}

#fotos .wp {
padding: 0;
}

#piatti .fotos img {
width: 100%;
}

#piatti .lo_mejor img.figaza,
#piatti .lo_mejor img.rodajas,
#piatti .lo_mejor img.pimienta,
#piatti .lo_mejor img.frances {
display: none;
}

#piatti .lo_mejor .copy h2 {
max-width: 187px;
margin: auto;
line-height: 1.2;
}

#piatti .lo_mejor .copy p {
font-size: 1.6em;
padding: 0 20px;
max-width: 100%;
margin-bottom: 50px;
}
/*4*/

/*5*/
#contatti {
height: 100%;
overflow: hidden;
}

#contatti video {
height: 100%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
width: auto !important;
}

#contatti .copy p {
font-size: 2em;
}
.foodPhoto {
margin-left: 0px;
}

}