@charset "utf-8";

@font-face {
    font-family: robo;
    src: url('font/Roboto100.woff') format('woff'), 
		 url('font/Roboto100.ttf') format('truetype');
    font-style: normal;
    font-weight: 100;
}
@font-face {
    font-family: robo;
    src: url('font/Roboto300.woff') format('woff'), 
		 url('font/Roboto300.ttf') format('truetype'); 
	font-style: normal;
    font-weight: 300;
}
@font-face {
    font-family: robo;
    src: url('font/Roboto400.woff') format('woff'), 
		 url('font/Roboto400.ttf') format('truetype');
    font-style: normal;
    font-weight: 400;
}
@font-face {
    font-family: robo;
    src: url('font/Roboto700.woff') format('woff'), 
		 url('font/Roboto700.ttf') format('truetype');
    font-style: normal;
    font-weight: 700;
}

@font-face {
	font-family: sanscl;
    src: url('font/RobotoC300.woff') format('woff'), 
		 url('font/RobotoC300.ttf') format('truetype'); 
	font-weight: 300;
	font-style: normal;
}
@font-face {
	font-family: icons;
	src: url(font/MaterialIcons-Regular.ttf) format('truetype');
}
@font-face {
	font-family: icons;
	src: local('Material Icons'),
		 local('MaterialIcons-Regular'),
		 url('font/MaterialIcons-Regular.woff2') format('woff2'),
		 url('font/MaterialIcons-Regular.woff') format('woff'),
		 url('font/MaterialIcons-Regular.ttf') format('truetype');
}
.ico {
	font-family: icons;
	font-size: 24px;
}

/*
@font-face {
    font-family: sanscl;
    src: url('font/OpenSans-CondLight.eot');
    src: url('font/OpenSans-CondLight.eot?#iefix') format('embedded-opentype'),
         url('font/OpenSans-CondLight.woff') format('woff'),
         url('font/OpenSans-CondLight.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
*/
/*@keyframes pluff {
	0% {opacity:0; transform:scale(1.5);} 
	40% {opacity:.2; transform:scale(1);} 
	100% {opacity:1}
	}
*/

@keyframes pluff {
	0% {opacity:0;} 
	40% {opacity:.2;} 
	100% {opacity:1}
	}

html, body {
	height:100%;
	}
body {
	margin:0;
	padding:0;
	font-family:robo, sans-serif;	
	background:var(--cb);
	}
p{
	font-size:15px;
	line-height:22px;
	color:var(--cp);
	}
a{
	text-decoration:none;
	}
img {
	margin:0;
	border:0;
	}
a:link, a:visited {
	color:var(--cl);
	}
a.btn {
	font-size: 18px;
	padding:4px 16px 6px 16px;
	background:var(--cub);
	color:var(--cuf) !important;
	margin-top:10px;
	}
a.btn:hover {
	background:#777;
	}
img.btn {
	margin:20px 0 !important;
	padding:6px !important;
	border:1px solid #ddd !important;
	}



	#privacy {
		position:fixed;
		z-index:99999;
		bottom:0;
		width:100%;
		padding:12px;
		background:rgba(0,0,0,0.9);
		text-align:center;
		border:solid 1px #fff;
		border-bottom:none;
		color:#fff;
	}
	#privacy button {
		display:inline-block;
		width:200px;
		padding:8px 20px;
		margin:15px;
		background:var(--cub);
		color:var(--cuf);
		border:solid 1px var(--cuf);
	}
	#privacy a {
		color:var(--cub);
	}
	


/*************/
#container {
	position:relative;
	margin:0 auto;
	width:100%;
	height:auto !important;
	height:100%;
	min-height:100%;
	}
header {
	position:relative;
	height:var(--hh);
	text-align:center;
	z-index:100;
	}
header.home, header.act {
	position:absolute;
	width:100%;
	}
#content {
	position:relative;
	padding:0 0 360px 0;
	min-width:1020px;
	margin:0 auto;
	z-index:10;
	animation: pluff .5s;
	overflow:hidden;
	}
#content.down {
	padding:36px 0 360px 0;
	}
footer {
	position:absolute;
	bottom:0;
	width:100%;
	height:360px;
	background:var(--cfb);
	color:var(--cff);
	z-index:50;
*	border-top:3px solid var(--cbB);
	}
footer a{
	position:relative;
	z-index:99;
	}
.c {
	position:relative;
	margin:0 auto;
	width:1020px;
	height:100%;
	}

main {
	position:relative;
	float:left;
	color:var(--cfg);
	width:100%;
	}

aside {
	display:inline-block;
	width:260px;
	margin-top:35px;
	vertical-align:top;
	}
	
#content:after, main:after, aside:after, #form:after, #news:after, .store:before {
    content: " ";
    display: block;
    font-size: 0;
    height: 0;
    clear: both;
	}
#content hr {
	clear:both;
	border:0px solid var(--cb);
	margin:0;
	}


/***** header *****/
#message {
	position:fixed;
	top:240px;
	width:350px;
	left:calc(50% - 175px);
	padding:30px;
	background:url(k6.png);
	z-index:999;
	transition:.4s;
	}
#message p{
	font-size:24px;
	text-align:center;
	color:#fff;
	}
#message h5{
	font-size:36px;
	text-align:center;
	color:#f00;
	}
#mnav {
	display:none;
	}

#drop {
	position:fixed;
	top:-90px;
	height:80px;
	width:100%;
	z-index:333;
	text-align:center;
	background:var(--chb);
	box-shadow:0px 0px 15px rgba(0,0,0,.7);
	transition:0.3s;
	}
#drop.on {
	top:0px;
	}
#drop a.logo img {
	position:relative;
	top:2px;
	height:calc(var(--logoh) * .6);
	}
#drop a.su{
	position:absolute;
	top:40px;
	right:20px;
	}

#logo {
	position:relative;
	top:var(--logot);
	z-index:199;
	}
#logo img {
	height:var(--logoh);
	}

#ham {
	display:none;
	}
#login {
	position:absolute;
	top:-300px;
	right:0;
	width:160px;
	padding:25px 20px;
	background:url(k6.png);
	z-index:999;
	transition:.4s;
	font-size:16px;
	text-align:left;
	}
#login.on {
	top:42px;
	}
#login p {
	margin:0 0 20px 0;
	color:#aaa;
	}
#login a {
	display: block;
	margin-top:12px;
	color:#fff;
	transition:0.3s;
	}
#login a:hover {
	color:var(--cub);
	}
iframe {
	border:0;
	overflow:hidden;
	}
iframe.login {
	width:100%;
	height:130px;
	}
#phot {
	position:absolute;
    top:calc(var(--hh) - 32px);	
	right:0px;
	z-index:199;
	transform:rotate(0);
	transition:.3s;
	}
#phot.on {
	transform:rotate(180deg);
	}

#top {
	position:absolute;
	width:1020px;
	top:2px;
	left:-510px;
	margin-left:50%;
	text-align:right;
	z-index:199;
	}
#top a {
	display:inline-block;
	margin-left:14px;
	text-align:left;
	opacity:1;
	transition:.2s;
	}
#top img {
	height:32px;
	}
#top a:hover {
	opacity:.7;
	}

#cerca {
	display:inline-block;
	width:44px;
	height:32px;
	transition:.3s;
	overflow:hidden;
	}
#cerca.on {
	width:260px;
	}

#cerca form {
	display:inline-block;
	vertical-align:top;
	}
#cerca input[type=text] {
	position:relative;
	top:-2px;
	width:180px;
	height:24px;
	border:none;
	}
#cerca button[type=submit] {
	position:relative;
	top:5px;
	height:26px;
	background-color:#999;
	border:1px solid #fff;
	padding:0
	}
#cerca button[type=submit]:hover {
	background-color:#555;
	}
#cerca img {
	height:auto;
	}

/***** menu *****/
.home #phot {
	visibility:hidden;
	}
.home:hover #phot, .home.act #phot {
	visibility:visible;
	}

#m {
    position:absolute;
	top:0;
    width:100%;
	min-width:1020px;
	height:var(--hh);
    list-style:none;  
	text-align:center;
    white-space:nowrap;
	}
#m div.back {
	position:absolute;
	top:0;
	width:100%;
	height:var(--hh);
	background: var(--chb);
*	background: url(/img/top-lx.png), url(/img/top-rx.png), url(/img/top-bg2.png), var(--chb);
	background-position:left, right;
	background-repeat:no-repeat, no-repeat, repeat;
*	background-size: auto, auto, 100% 100%;
	z-index:100;
	}

.home #m div.back {
	background: var(--chbo);
	background: url(/img/top-lx.png), url(/img/top-rx.png), url(/img/top-bg2.png), var(--chbo);
	background-position:calc(50% - 450px) 0px, right;
	background-repeat:no-repeat, no-repeat, repeat;
	background-size: 160px, auto, 100% 100%;
	transition:.5s;
	}
.home:hover #m div.back, .home.act #m div.back  {
	background: var(--chb);
	background: url(/img/top-lx.png), url(/img/top-rx.png), url(/img/top-bg2.png), var(--chb);
	background-position:calc(50% - 450px) 0px, right;
	background-repeat:no-repeat, no-repeat, repeat;
	background-size: 160px, auto, 100% 100%;
	}
	
#m > li {
	display:inline-block;
    margin:calc(var(--hh) - 38px) 0 0 0;	
    padding:3px 18px;
	cursor:pointer;
	text-align:center;
	}
#m a {
	display:inline-block;
	position:relative;
	z-index:150;
	}
#m a p {
	position:relative;
	z-index:199;
	margin:3px;
	font-size:20px;
	font-weight:300;
    color:var(--cgf);
	transition:.3s;
	}
#m :hover p, #m .act a p{
	color:var(--cga);
	}
#m > li img{
	position:absolute;
	bottom:25px;
	margin:0;
	}

/* sub */
.home #m li {
	opacity:0;
	transition:0s;
	transition-delay:0s;
	}

#m li:hover > ul, #m li.act > ul {
	transform:translateY(0px);
	}
#m li.act > ul {
	z-index:50;
	}

#m ul {
	position:absolute;
    top:calc(var(--hh) - 40px);	
	left:0px;
	width:100%;
	padding:0;
    list-style:none;
	background:var(--cmb);
	transform:translateY(-60px);
	transition:.3s .3s;
	z-index:80;
	box-shadow:0px -3px 15px rgba(0,0,0,.5);
	}

.home:hover #m li {
	opacity:1;
	transition:.5s;
	transition-delay:.3s;
	}
	
#m ul li {
    display:inline-block;  
    position:relative;
	padding:0;
	}
#m ul a {    
    display:block;
    height:44px;
    padding:8px 18px;
    white-space:nowrap;
    float:none;
	transition:.2s;
	}
#m ul a p {    
	margin-top:22px;
	font-size:17px;
	font-weight:400;
	color:var(--cmf) !important;
	}
#m ul a:hover, #m ul .act {
	background:var(--cmab) !important;
	}
#m ul a:hover p, #m ul .act p {
	color:var(--cmaf) !important;
	}

/** Filtro **/
#filtro {
	width:1020px;
	margin:auto;
	text-align:center;
	margin-top:40px;
	}
#filtro li {
	font-size:16px;
	font-weight:normal;
	margin:0 10px;
	display:inline-block;
	color:#ccc;
	}
#filtro li:before {
	content:"■";
    padding:0 2px 0 0;
	font-size:28px;
	position:relative;
	top:2px;
	}
#filtro a {
	color:#aaa;
	transition:0.3s;
	}
#filtro a:hover, #filtro .act a {
	color:#666;
	text-shadow: 0px 0px 1px #888;
	}
#filtroi {
	width:1020px;
	margin:auto;
	text-align:center;
	margin-top:60px;
	}
#filtroi li {
	margin:0 10px;
	display:inline-block;
	}
#filtroi img {
	height:50px;
	}


/*footer*/
#letter {
	text-align:center;
	}
#addr {
	position:absolute;
	top:15px;
	font-size:15px;
	}
#legal {
	position:absolute;
	bottom:10px;
	width:1020px;
	text-align:center;
	font-size:11px;
	}
#legal a {
	display:block;
	color:var(--cub);
	font-size:13px;
	}
#key a{
	position:absolute;
	right:60px;
	top:12px;
	width:16px;
	height:16px;
	background:url(lockc.png);
	display:block;
	}
#mau a{
	position:absolute;
	right:0px;
	top:14px;
	width:40px;
	height:14px;
	background:url(mau.png);
	display:block;
	}

footer nav {
	position:absolute;
	top:40px;
	right:0;
	text-align:right;
	}
footer nav a {
	display:block;
	padding:3px 0 ;
	font-size:16px;
	color:#fff;
	transition:0.3s;
	}
footer nav a:hover {
	color:var(--cub);
	}
footer nav.lay {
	position:relative;
	top:10px;
	text-align:center;
	margin-bottom:5px;
	}
footer nav.lay a {
	display:inline-block;
	}




/******** side ********/
	
iframe.newsletter {
	width:220px;
	height:110px;
	}

a.b {
	display:inline-block;
	height:26px;
	padding:0 14px;
	margin:3px 4px;
	text-align:center;
	font-size:16px;	
	line-height:24px;
	color:#fff;
	background:#999;
	}
a.b:hover {
	background:var(--cub);
	}

#allnews {
	display:block;
	width:180px;
	height:26px;
	text-align:center;
	line-height:26px;
	margin:10px auto;
	font-size:16px;	
	color:#fff;
	background:#888;
	border: 1px solid #666;
	}
#allnews:hover {
	background:var(--cub);
	}
#tag {
	display:block;
	width:400px;
	margin:10px auto;
	text-align:center;
	}


/**************/

#cal{
	width:500px;
	margin: 20px;
	}
	
#prenota {
	text-align:center;
	}




/**************/


.art{
	transform: translate(-80px,0); 
	opacity: 0;
	transition: .7s .1s;
}
.s .art{
	transform: translate3d(-100px,0,0); 
	}
.A .art{
	transform: translate3d(100px,0,0) scale(.90); 
	}
.B .art{
	transform: rotate(180deg); 
	transform: scale(1.1); 
	}
.C .art{
	transform: rotate(180deg) translate3d(-100px,0,200px) scale(1.1); 
	}

#medium .hw {
	transform: translate(0,100px); 
	opacity: 0;
	transition: transform .7s .2s, opacity .7s .2s, background .2s;
}
#small .hw {
	transform: scale(.10); 
	opacity: 0;
	transition: transform .7s .2s, opacity .7s .2s, top .6s;
}
#news .hw {
	transform: translate(0,100px); 
	opacity: 0;
	transition: transform .7s .2s, opacity .7s .2s, background .2s;
}


.art.trig, .hw.trig{
	opacity: 1 !important;
	transform: none !important; 
}