@charset "UTF-8";
/* Penha Longa - CSS Mobile */

@media (max-width: 767px){
	
	.sergi-arola-signature{
		position: absolute;
		display: block;
		width: 100vw;
		height: 40px;
		bottom: 30px;
		left: 0;
		z-index: 888;
	}

	.sergi-arola-signature svg{
		position: absolute;
		display: block;
		width: auto;
		height: 100%;
		bottom: 0;
		left: 50%;
		transform: translate(-50%, 0);
	}

	.sergi-arola-signature svg path{
		fill: rgba(255,255,255,1);
	}

	.sergi-arola-signature.black svg path{
		fill: rgba(0,0,0,1);
	}

	.sergi-arola-signature-xl{
		position: absolute;
		display: block;
		width: auto;
		height: 50px;
		bottom: calc(100% - 80px);
		left: 40px;
		z-index: 888;
	}

	.sergi-arola-signature-xl svg{
		position: absolute;
		display: block;
		width: auto;
		height: 100%;
		bottom: 0;
		left: 0;
	}

	.sergi-arola-signature-xl svg path{
		fill: rgba(255,255,255,1);
	}

	.sergi-arola-signature-xl.black svg path{
		fill: rgba(0,0,0,1);
	}

	.sergi-arola-signature-cr{
		position: relative;
		display: block;
		width: auto;
		height: 70px;
		z-index: 888;
	}

	.sergi-arola-signature-cr svg{
		position: absolute;
		display: block;
		width: auto;
		height: 100%;
		bottom: 0;
		left: 0;
	}

	.sergi-arola-signature-cr svg path{
		fill: rgba(0,0,0,1);
	}

	.sergi-arola-signature-cr.black svg path{
		fill: rgba(0,0,0,1);
	}
	.top-headline h2{
		position: relative;
		display: block;
		font-size: 32px;
		padding: 0 40px;
		margin: 0 0 15px 0;
	}
	
	.top-headline h4{
		position: relative;
		display: inline-block;
		height: 14px;
		font-size: 18px;
		line-height: 20px;
		padding: 0;
		margin: 0 0 6px 0;
		color: rgb(255,255,255);
		transition: all .4s ease;
	}
	
	.top-headline h4 .home-arrow-left{
		position: absolute;
		display: block;
		width: 7px;
		height: 7px;
		top: 0;
		left: -30px;
	}

	.top-headline h4 .home-arrow-left svg{
		position: relative;
		display: inline-block;
		width: 14px;
		height: 14px;
		animation: arrowheadleft 2s infinite;
	}
	
	.scroll-down-text{
		position: absolute;
		display: none;
		width: auto;
		height: auto;
		bottom: 80px;
		left: 50%;
		transform: translate(-50%, 0);
		font-family: 'LAB-HEADER';
		font-weight: 200;
		font-size: 12px;
		text-align: center;
		color: rgba(255,255,255,1);
		z-index: 777;
		animation: mousetext 2s infinite;
	}
	
	.michelin-star{
		position: absolute;
		display: block;
		width: auto;
		height: 26px;
		bottom: 80px;
		left: 50%;
		transform: translate(-50%, 0);
		z-index: 888;
	}
	
	.restaurant{
		position: relative;
		display: block;
		width: 100vw;
		height: auto;
		padding: 80px 0 80px 0;
		/*background-color: rgba(0,255,0,0.5);*/
	}
	
	.restaurant .container .image .frame{
		position: relative;
		width: 100%;
		height: 100vw;

		background-repeat: no-repeat;
		background-size: cover;
		background-position: left;
	}
	
	.restaurant-home-menu .container .image img{
		position: relative;
		width: 100%;
		height: auto;
		top: auto;
		bottom: 0;
		padding: 80px 0 0 0;
		transform: translate(0, 0);

		-webkit-filter: drop-shadow(18px 18px 24px rgba(0,0,0,0.1));
		filter: drop-shadow(18px 18px 24px rgba(0,0,0,0.1));
	}
	
	.restaurant .container .text{
		padding: 0 40px;
		margin: 0 0 80px 0;
		/*background-color: rgba(0,0,255,0.5);*/
	}
	
	.restaurant-home-menu .container .text{
		padding: 0 40px 0 40px;
		/*background-color: rgba(0,0,255,0.5);*/
	}
	
	.slider2{
		position: relative;
		display: block;
		width: 100vw;
		height: auto;
		padding: 120px 0 0 0;
		/*background-color: rgba(0,255,0,0.5);*/
	}

	.slider2 .container{
		width: 100%;
		/*background-color: rgba(255,0,0,0.5);*/
		padding: 0;
	}

	.slider2 .container .image{
		padding: 0;
		/*background-color: rgba(255,0,255,0.5);*/
	}

	.slider2 .container .image .frame{
		position: relative;
		width: 100%;
		height: 100vw;

		background-repeat: no-repeat;
		background-size: cover;
		background-position: right;
	}
	
	.team{
		position: relative;
		display: block;
		width: 100vw;
		height: auto;
		padding: 0;
		/*background-color: rgba(0,255,0,0.5);*/
	}
	
	.team .container .text{
		padding: 80px 40px;
		/*background-color: rgba(0,0,255,0.5);*/
	}
	
	.team .container .image{
		padding: 0;
		/*background-color: rgba(255,0,255,0.5);*/
	}

	.team .container .image img{
		position: relative;
		max-width: calc(100% - 40px);
		max-height: 100%;
		left: 0;
		bottom: 0;
	}

	.team .container .image .frame{
		position: relative;
		width: 100%;
		height: auto;

		background-repeat: no-repeat;
		background-size: cover;
		background-position: left;
	}

	.team .container .image .frame:before{
		content: "";
		width: 1px;
		padding-bottom: 100%;
		display: block;
	}
	
	.vladimir-veiga{
		position: relative;
		display: block;
		width: 100vw;
		height: auto;
		padding: 80px 0;
		overflow: auto;
		background: transparent;
		background-color: rgb(0,0,0);

		background-image: url(../images/team/vladimir-veiga.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: calc(100% + 100px);
	}
	
	.vladimir-veiga .container .text{
		padding: 0 40px;
		color: rgb(255,255,255);
		/*background-color: rgba(0,0,255,0.5);*/
	}
	
	.media-gallery{
		position: relative;
		display: block;
		width: 100vw;
		height: auto;
		padding: 80px 0 60px 0;
		/*background-color: rgba(0,255,0,0.5);*/
	}
	
	.media-gallery .container .text{
		padding: 0  40px 0 40px;
		/*background-color: rgba(0,0,255,0.5);*/
	}
	
	.feed-intro{
		position: relative;
		display: block;
		width: 100vw;
		height: auto;
		padding: 30px 40px;
		background-color:rgb(75,75,75);
	}

	.feed-intro h2{
		color: rgb(255,255,255);
		font-size: 24px;
		font-weight: 300;
		text-align: center;
		line-height: 30px;
		padding: 0;
		margin: 0;
	}

	.feed-intro h2 a{
		color: rgb(255,255,255);
		text-decoration: none;
	}
	
	#ifeed {
		position: relative;
		display: block;
		overflow: hidden;
		width: 100vw;
		height: 200vw;
		padding: 0;
		margin: 0;
		border:none;
	}
	
	.address-bar{
		position: relative;
		display: block;
		width: 100vw;
		height: auto;
		min-height: auto;
		padding: 60px 40px;
		background-color:rgb(75,75,75);
	}

	.address-bar .lab-signature{
		position: relative;
		display: block;
		width: 100%;
		height: 100px;
		top: 0;
		left: 0;
		margin: 0 0 30px 0;
		transform: none;
	}

	.address-bar .lab-signature .llbs{
		position: absolute;
		display: block;
		width: 100%;
		height: 100%;
	}

	.address-bar .lab-signature .llbs svg{
		position: relative;
		display: block;
		width: auto;
		height: 100%;
		left: 50%;
		transform: translate(-50%, 0);
	}

	.address-bar .lab-signature .llbs svg path{
		fill: rgb(255,255,255);
	}

	.address-bar .lab-address{
		position: relative;
		display: block;
		width: auto;
		height: auto;
		top: auto;
		right: 50%;
		transform: translate(50%, 0);
		text-align: center;
	}

	.address-bar .lab-address h3{
		padding: 0;
		margin: 0 0 5px 0;
		color: rgb(255,255,255);
		font-weight: 400;
	}
	.address-bar .lab-address h5{
		padding: 0;
		margin: 0;
		color: rgb(255,255,255);
		font-weight: 400;
	}
	
	#google-maps{
		position:relative;
		display:block;
		overflow: hidden;
		width:100%;
		height:100vw;
		background-color:rgba(0,255,0,0);
		margin:0;
	}

	#map{
		position:absolute;
		width:100%;
		height: calc(100vw + 30px);
	}
	
	.contact{
		position: relative;
		display: block;
		width: 100vw;
		left: 50%;
		height: auto;
		padding: 60px 40px;
		transform: translate(-50%, 0);
	}

	.contact h3{
		position: relative;
		display: block;
		width: auto;
		height: auto;
		width: 100%;
		height: auto;
		font-size: 32px;
		font-weight: 400;
		margin: 0 0 15px 0;
		text-align: center;
	}

	.contact .phone{
		position: relative;
		display: block;
		width: 100%;
		height: auto;
		padding: 0;
		font-size: 24px;
		font-weight: 200;
		text-align: center;
		
	}

	.contact .phone span{
		font-weight: 400;
	}

	.contact .phone a{
		position: relative;
		display: inline-block;
		color: rgb(27,27,27);
		padding: 0 0 0 30px;
		margin: 0 0 15px 0;
		text-decoration: none;
		transition: all .2s ease;
	}

	.contact .phone a:hover{
		color: rgb(1,0,251);
	}

	.contact .phone a svg{
		position: absolute;
		display: block;
		width: 30px;
		height: 30px;
		top: 50%;
		left: 0;
		transform: translate(0, -50%);
		padding-bottom: 5px;
	}

	.contact .phone a svg path{
		fill: rgb(27,27,27);
	}

	.contact .phone a:hover svg path{
		fill: rgb(1,0,251);
	}

	.contact .schedule{
		padding: 10px 0 0 0;
		margin: 0 0 15px 0;
		text-align: center;
	}

	.contact .email{
		padding: 0;
		font-size: 24px;
		font-weight: 200;
		text-align: right;
	}

	.contact .email a{
		color: rgb(27,27,27);
		text-decoration: none;
		transition: all .2s ease;
	}

	.contact .email a:hover{
		color: rgb(1,0,251);
	}

	.contact .email a span{
		text-transform: uppercase;
		font-weight: 400;
	}

	.footer{
		position: relative;
		display: block;
		width: 100vw;
		height: auto;
		font-size: 14px;
		padding: 0 40px 0 40px;
	}

	.footer .copyright{
		position: relative;
		display: block;
		margin: 0 0 15px 0;
		float: left;
	}

	.footer .links{
		position: relative;
		display: block;
		margin: 0 0 60px 0;
		float: right;
	}

	.footer .links ul{
		position: relative;
		padding: 0;
		margin: 0;
	}

	.footer .links ul li{
		position: relative;
		display: inline-block;
	}

	.footer .links ul li a{
		color: rgb(27,27,27);
		text-decoration: none;
		transition: all .2s ease;
	}

	.footer .links ul li a:hover{
		color: rgb(1,0,251);
	}
}