@charset "utf-8";
/* CSS Document */

/*general*/
body {background: url(../img/asanoha.png) repeat fixed;}
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing:border-box; }
p { line-height:1.3em;}
.container {width:94%; margin:0 auto; font-family:'Poppins', sans-serif; color:#333; overflow:auto; position:relative;}
.header, .navbar, .content {width:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing:border-box; position:relative; background:#FFF;}
h1, h2, h3, h4, h5, h6 {padding:3px 0 0 0; margin:0; line-height:1.4em;}
h2 { font-size:22px;}
h3 { font-size:19px;}
h4 { font-size:17px; color:#666;}
h5 { font-size:16px; color:#666; border-bottom: 1px solid #CCC;}

.button {padding:3px 12px; margin:.5%; border-radius:6px; line-height:1.3em; text-align:center;}
.button:hover {opacity:.6; filter: alpha(opacity=60); cursor:pointer;}
.imgcontainer {overflow: hidden; height:100px;}
.imgcontainer img {width:100%; height:auto; position:absolute; top:-20px;;}
.scale {width:100%; height:auto;}
.scale60 {width:60%; height:auto;}
.scale80 {width:80%; height:auto;}
.thumb {float:left; padding-right:12px; width:35%; height:auto;}
.lined {border-bottom: 1px solid #CCC;}
.specs {border:1px solid #C60; padding:2px 12px}
.pad {padding:2px .5%;}
.breath { margin:20px auto !important; padding: 15px; }
.blank { margin:12px; padding:12px; clear:both; position:relative;}

/*Header*/
.header {overflow:auto; }
.logo {width:60%; width:auto; padding:0 12px; float:left;}

/*Navbar*/
.navbar * { zoom: 1; }
.navbar {width:100%; position:relative; display:block; background:#000000; z-index:255; height:auto; }
.navbar ul, .navbar li { list-style: none; z-index:255; background:#000000; }
.navbar > ul { margin:0; padding:0; height:34px; }
.navbar > ul > li { position:relative; float:left; display:inline; font-size:15px; height:34px; }
.navbar ul ul {position:absolute; display:none; top:34px; left:0; margin:0; padding:0; width:250px; }
.navbar ul ul:after { clear: both; display: block; font: 1px/0px serif; content: "."; height: 0; visibility: hidden; }
.navbar ul ul li { float: left; display: block !important; display: inline; width:100%; border-top:1px solid #999; background:transparent; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#1AFFFFFF,endColorstr=#1AFFFFFF); background: rgba(255,255,255,0.1); text-align:center; font-size:12px; height:30px;}
.navbar ul li a { float: none !important; float: left; display: block; padding:6px 10px; text-decoration:none; color:#FFF; height:auto !important; height: 1%; }
.navbar ul li:first-child { border:none; }
.navbar li { border-left:1px solid #777; }
.navbar ul a:hover, .navbar ul li:hover a, .navbar ul li.iehover a {  }
.navbar ul li:hover li a, .navbar ul li.iehover li a { float: none; }
.navbar ul li:hover li a:hover, .navbar ul li:hover li:hover a, .navbar ul li.iehover li a:hover, .navbar ul li.iehover li.iehover a { background:transparent; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#66FFFFFF,endColorstr=#66FFFFFF); background: rgba(255,255,255,0.4); }
.navbar ul li a:hover { background:transparent; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#66FFFFFF,endColorstr=#66FFFFFF); background: rgba(255,255,255,0.4); }
.navbar ul li:hover ul, .navbar ul ul li:hover ul, .navbar ul li.iehover ul, .navbar ul ul li.iehover ul { display: block; }
.navbar .button { color:#FFFFFF !important; font-weight:bold; }
.icon {width:25px; height:auto; *:width:18px;}
.menubot {display:none !important;}
.navbar i { line-height:22px; }

/*slider-parallax*/
.slider {height:200px; background: transparent; overflow:hidden; margin-top:-12px; color:#FFF; text-shadow:2px 2px 4px #000; position:relative; z-index:1; width:100%; :*background:url(img/food.jpg) no-repeat center;}
.slider .text {position:absolute; top:12px; left:12px; padding:6px 1%; background:transparent; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#66000000,endColorstr=#66000000); background:rgba(0,0,0,.4); max-width:50%;}
.slider .text p a {font-size:11px; color:#FFF;}
.slider.esp .text {position:absolute; top:0; left:0; padding:6px 1%; background:transparent; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#66000000,endColorstr=#66000000); background:rgba(0,0,0,.4); max-width:none;}

/*Content*/
.content {display:block; overflow:auto; z-index:10 !important; background:#FFFFFF !important;}

/*Footer*/
.footer { font-size:10px; text-align:right; padding:6px 16px; overflow:auto;}

/*Boxes - colors are in gradients.css*/
.box {margin:.5%; float:left; position:relative; overflow:hidden; }
.box h1, .box h2, .box h3, .box p, .box h4 {padding:4px 6px 0 6px; z-index:125; position:relative;}
.border, .borderall .box {border:#999 1px solid;}
.round, .roundall .box { border-radius:6px;}
.click:hover, .clickall .box:hover {opacity:.6; filter: alpha(opacity=60); cursor:pointer; *:color:#666;}
.center { text-align:center; }
.aleft { text-align:left; }
.aright { text-align:right; }
.centerbox {margin:0 auto; display:block; float:none;}
.smallp {font-size:12px; margin:0 12px;}

.box ul {margin-left:5%;}
.box ul li {padding:0; line-height:1.2em;}

.first {clear:left;}
.last {float:right !important; clear:right;}
.right {float:right !important;}
.left {float:left !important;}
.clear {clear:both;}
.col-12 {width:98.96%;}
.col-11 {width:90.63%;}
.col-10 {width:82.7%;}
.col-9 {width:73.97%;}
.col-8 {width:65.64%;}
.col-7 {width:57.31%;}
.col-6, .col-6all .box {width:48.98%; *:width:48.5%;}
.col-5 {width:40.65%;}
.col-4, .col-4all .box {width:32.32%; *:width:32%;}
.col-3, .col3, .col-3all .box {width:23.99%; *:width:23.7%;}
.col-2, .col-2all .box {width:15.66%;}
.col-1 {width:7.33%;}
.col-b {width:3.33%; margin-left:.2%}

/*pestañas*/
.pesta { display:box; position:relative; padding:0px; clear:both; height:auto; overflow:auto; list-style:none; margin:20px 10px 0px 20px !important; }
.pesta li { display:inline; float:left; margin:0px; position:relative; color:#AAA; text-align:center; font-weight:bold; padding:20px auto; list-style-type:none; }
.pesta li:last-child { clear:right; }
.pesta li { background:#F4F7FB; border:1px solid #E3EBEE; border-top-left-radius: 12px; border-top-right-radius: 12px; border-bottom:1px solid #C2D0E0; }
.pesta li a { display:inline-block; color: inherit; cursor: hand; cursor:pointer; text-decoration:none; margin:20px auto; }
.pesta li:hover { background:#ecf0f4; border:1px solid #CCC; color:#222222; cursor:pointer; }
.psel { border:1px solid #C2D0E0 !important; border-bottom:1px solid #FFFFFF !important; color:#222222 !important; background:#FFF !important; cursor:auto !important; }
.ficho { border:1px solid #C2D0E0; border-top:none; margin: 0px 43px 20px 20px !important; height: auto; font-size:14px !important; padding:0px 40px; }
.ficho div { float:left; display:inline !important; }

/*Badges*/
.starred:before { content:url(img/star2.png); float:left; padding-right:9px; margin-left:-12px; margin-top:3px;}
.badge {overflow:hidden;}
.badge:after {transform:rotate(45deg); box-shadow:2px 2px 5px #333; width:210px; text-align:center; font-weight:bold; position: absolute; top:30px; right:-65px; z-index:1100}
.construccion:after {content:"En construcción";  color:#FFF;  background:orange; border:2px solid #F9FC78; top:46px; right:-48px; }
.nuevo:after {content:"Nuevo";  color:#FFF;  background: #690; border:2px solid #6C0; }
.special:after {content:"Especial";  color:#FFF;  background: #C00; border:2px solid #F30;}
.precio:after {content:"5€";  color:#FFF;  background: #222; border:2px solid #111;}

/*forms*/
input, textarea {padding:2px; border:#999 1px solid; border-radius:4px;} 
.valor { background:#FFF; position:relative; display:block; overflow:visible; width:113px; height:26px; float:left; }
.valor div { position:absolute; top:0px; left:0px; background:#fcd242; height:24px; z-index:3; }
.valor img { position:absolute; top:0px; left:0px; z-index:4; }
.commen { float:left; margin-left:15px; }

/*Gtranslator*/
.goog-te-banner-frame.skiptranslate {display: none !important;} 
body { top: 0px !important; }
#google_translate_element {position:absolute; top:0; left:0; z-index:255; outline: 1px solid #FFF; outline-offset:-1px; font-size:9px !important}

.vervid { cursor:pointer; position:relative; background:#000; }
.vervid img { filter:alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5; }
.play-icon { width: 50px; height: 50px; border-radius: 50px; color: #fff; position: absolute; left: 0; right: 0; top: 0; bottom: 0;
    margin: auto; border: 3px solid #fff; padding: 4px 13px; font-size:24px; line-height:40px; }
.vervid:hover > .play-icon { border:3px solid red; background:red; }
.vervid:hover > img { filter:alpha(opacity=100); -moz-opacity: 1; opacity: 1; }
#tvcontainer { width:100%; background:#000; height:400px; overflow:hidden; box-sizing:border-box; }


@media (max-width:1024px) {
	body {margin:0; padding:0; background:#FFF;}
	.container {width:100%;}
	.imgcontainer img {top:-10%;}
	.slider .text {max-width:70%;}
	.thumb {width:50%; margin-left:-20%;}
	.navbar li {display:inline-block;}	
	}

@media (max-width:860px) {
	.navbar > ul { height:auto; }
	.navbar > ul > li {display:none; width:100%; font-size:16px !important; text-align:center; float:none !important; clear:both; border-bottom:1px solid #333; height:auto !important;}
	.navbar > ul > li:first-child { border-bottom:1px solid #333; }	
	.navbar ul ul {position:relative !important; width:100% !important; float:none !important; clear:both; top:0px; left:0px; }
	.navbar ul ul li {width:100% !important; float:none !important; display:block !important; position:relative !important; border-bottom:#666 1px solid; font-size:14px; clear:both;height:auto !important;}
	.navbar > ul > li > ul > li:first-child { border-bottom:1px solid #666; }	
	.navbar ul li a { float: none !important; display: block !important; padding:2px; }	
	.menubot {display:inline-block !important;}
.starred:before {float:none; margin-top:6px;}
.home img {float:none !important;}
.slider {top:0; height:180px;}
.slider .text {max-width:none !important; width:100%; left:0;} 

	.col-2, .col-2all .box {width:32.32% !important;}
	.col-3, .col-3all .box {width:48.98% !important;}
	.col-4, .col-4all .box {width:48.98% !important;}
	.col-6:not(.later), .col-6all:not(.later) .box {width:98.96% !important;}
	
h1 {font-size: 4vw;}
h2 {font-size: 3vw;}
h3, h4 { font-size: 2.5vw; line-height:1.2em;}
p {font-size: 2.2vw;}

.badge:after {font-size:11px; top:26px; right:-68px;}
.thumb {width:60%; margin-left:-25%;}
	}
	
@media (max-width:480px) {
	.slider {overflow-y:auto;}
	.slider .text{position:relative;}
	.col-2, .col-2all .box {width:48.98% !important;}
	.col-4, .col-4all .box, .col-3, .col-3all .box, .col-6, .col-6all .box, .oddbox, .box.centerbox {width:98.96% !important;}
	h1 { font-size: 6vw;}
	h2 { font-size: 5vw;}
	h3, h4 { font-size: 4vw;}
	p {font-size: 3vw;}
.badge:after {display:block; transform:rotate(0deg); position:relative; width:100%; top:auto; right:auto; clear:both;}
.thumb {width:50%; margin-left:-20%;}
	}