@import url(https://fonts.googleapis.com/css?family=Cookie|Yanone+Kaffeesatz|Satisfy);

html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
*, *:before, *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
  }
  
body {
	margin:0;
	padding:0;
	overflow-y:scroll;
	font-size:18px;
	position:relative;
	background-color:#FFFFFF;
	-webkit-transition: all 500ms ease-out;
    -moz-transition: all 500ms ease-out;
    -o-transition: all 500ms ease-out;
    transition: all 500ms ease-out;
	background-color: #444444;
}
#page {
	display:block;
	max-width:1024px;
	margin:0 auto;
-webkit-box-shadow: 0px 1px 13px 0px rgba(0, 0, 1, 0.72);
-moz-box-shadow:    0px 1px 13px 0px rgba(0, 0, 1, 0.72);
box-shadow:         0px 1px 13px 0px rgba(0, 0, 1, 0.72);
}

#page.inviapartecipazione {height:100%;padding:0;font-size:0.8em;background-color:#FFFFFF;font-family:consolas;}
#page.inviapartecipazione h1 {display:block;background-color:#66666;margin-top:0;width:100%;}
#page.inviapartecipazione .page {padding:20px;text-align:left;padding-top:110px;;}

a {outline: 0;-webkit-tap-highlight-color: rgba(0,0,0,0);}
textarea:focus, input:focus{
    outline: none;
	background-color:#FFFFBF !important;
}
#header {
	position:fixed;
	top:0;
	
	width:100%;max-width:1024px;
	height:auto;
	
	margin:0 auto;
	padding:0;
	
	text-align:center;
	z-index:3;
	overflow:hidden;
	border-bottom:8px dashed #DDDDDD;	
}
/* 
#footer {
	position:fixed;
	bottom:0;
	width:100%;
	margin:0 auto;
	text-align:center;
	height:auto;
	padding:0;
} */

#navigation {
	width:auto;
	height:auto;
	margin:0 auto;
	padding:20px 10px 0px 10px;
	background-color:#DDDDDD;	
}

.incastri-on #navigation {
	border-left:8px dashed #444444;
	border-right:8px dashed #444444;

}

.navigation a {
	display:inline-block; width:40px; height:40px;margin:0 15px 20px 15px;
	text-align:center;	
}
.navigation a svg {
	text-align:center;
	width:100%;
	height:100%;
	-webkit-transition: all 500ms ease-out;
    -moz-transition: all 500ms ease-out;
    -o-transition: all 500ms ease-out;
    transition: all 500ms ease-out;
}

.navigation a:last-child {margin-right:0 !important;}
.navigation a, .navigation a:link, .navigation a:visited {color:#555555;}
.navigation a.active {
	/* -webkit-filter: drop-shadow( 1px 1px 1px #000 );
    filter: drop-shadow( 1px 1px 1px #000 );  */
}
.navigation a.active svg {
	-ms-transform: scale(1.2);
    -webkit-transform: scale(1.2); 
    transform: scale(1.2);
}
.navigation a img {width:100%;}
.navigation a svg {width:100%;height:100%;}

/* #footer .navigation {
	-webkit-transition: all 500ms ease-out;
    -moz-transition: all 500ms ease-out;
    -o-transition: all 500ms ease-out;
    transition: all 500ms ease-out;	
}

#footer .navigation.first a.up {-webkit-transform: scale(0); transform: scale(0);width:0;height:0;margin-right:0;}
#footer .navigation.first a.down {margin-right:0;}
#footer .navigation.last a.down {-webkit-transform: scale(0); transform: scale(0);width:0;height:0;margin-right:0;}
#footer .navigation.last a.up {margin-right:0;} */

.button {
	display:inline-block;
	position:relative;
	font-family:"Yanone Kaffeesatz";
	font-size:1.4em;
	font-weight:normal;
	text-align:center;
	color:#FFFFFF;
	padding:16px 16px;
	border-radius:6px;	
	border:none;
	margin:20px;
	cursor:pointer;	
	max-width:500px;
	text-decoration:none;
	-webkit-transition: all 300ms ease-out;
    -moz-transition: all 300ms ease-out;
    -o-transition: all 300ms ease-out;
    transition: all 300ms ease-out;	
}
.button:hover {opacity:0.7;}

.button svg {width:40px;height:40px;float:left;margin-right:10px;}
.button span.buttontext {text-align:center;padding-top:4px;display:inline-block;}
.button span {text-align:center;}
.button div {width:100%;text-align:center;font-size:20px;margin-top:12px;}
.button .title-left {display:block;text-align:left;font-size:1em;font-weight:bold;margin-top:4px;}
.button .text-small {text-align:left;font-size:0.8em;font-weight:normal;margin-top:10px;display:block;}


.page {
	text-align:center; z-index:0;padding:30px;position:relative;border-top:8px dashed #FFFFFF;
	
	-webkit-transition: all 200ms ease-out;
    -moz-transition: all 200ms ease-out;
    -o-transition: all 200ms ease-out;
    transition: all 200ms ease-out;
}
.incastri-on .page {
	border-left:8px dashed #444444;
	border-right:8px dashed #444444;
}

.page div.inner {
	position:relative;
-moz-transition: all 200ms ease-out;
    -o-transition: all 200ms ease-out;
    transition: all 200ms ease-out;
}
/* .no-mobile .page.blur div.inner {opacity:0.4;-webkit-transition: all 500ms ease-out;
    
 -webkit-filter: blur(2px);
	-moz-filter: blur(2px);
	-o-filter: blur(2px);
	-ms-filter: blur(2px);
	filter: blur(2px); 
} */
.page.focus div.inner {opacity:1;}
.page * {z-index:1;}
.page::after  { content: ""; display:none; opacity: 0.1; top: 0; left: 0; bottom: 0; right: 0; position: absolute; background-size:cover; background-repeat:no-repeat; z-index: -1; } 

.page h2 {
	font-family:"Yanone Kaffeesatz";
	font-size:5em;
	font-weight:normal;
	margin:0 20px 10px 20px;	
	text-transform: capitalize;
}

.page h3 {
	font-family:"Yanone Kaffeesatz";
	font-size:3em;
	font-weight:normal;
	margin:0 20px 10px 20px;	
}

.fold {display:none;position:relative;width:100%;padding:30px;margin:30px 0;border:1px dashed #FFFFFF;border-bottom:1px dashed #FFFFFF;background-color:inherit;opacity:0.8;}
.fold h2 {font-size:3em;margin-bottom:20px;}

.subtitle {font-family:"Cookie";font-size:2.4em;font-weight:normal;margin:0 20px 30px 20px;}

label {display:block;width:100%;max-width:400px;font-family:"Yanone Kaffeesatz";font-size:1.2em;text-align:left;margin-bottom:10px;
	margin-left:auto;
	margin-right:auto;}

input[type=text], input[type=email] {
	display:block;
	background-color:#FFFFFF;
	border-radius:6px;
	border:none;
	padding:10px 14px;
	width:100%;
	margin-top:6px;
	font-family:"Yanone Kaffeesatz";font-size:1.1em;
	
}
input[type=text]::-webkit-input-placeholder { /* WebKit browsers */	font-size:16px;text-align:left;	   color:#AAAAAA;font-family:"Yanone Kaffeesatz";font-size:1em;}
input[type=text]:-moz-placeholder { /* Mozilla Firefox 4 to 18 */		font-size:16px;text-align:left;color:#AAAAAA;font-family:"Yanone Kaffeesatz";font-size:1em;}
input[type=text]::-moz-placeholder { /* Mozilla Firefox 19+ */			font-size:16px;text-align:left;color:#AAAAAA;font-family:"Yanone Kaffeesatz";font-size:1em;}
input[type=text]:-ms-input-placeholder { /* Internet Explorer 10+ */	font-size:16px;text-align:left;color:#AAAAAA;font-family:"Yanone Kaffeesatz";font-size:1em;}

input[readonly] {background-color:#EEEEEE !important;}

.page .illustrazione {width:40%;max-width:400px;}
.page.annuncio .illustrazione {width:40%;max-width:400px;}
.page.cerimonia .illustrazione {width:30%;}
.page.regali .illustrazione {width:30%;}
.page.credits .illustrazione {width:30%;display:block;clear:both;margin:30px auto 0 auto;}
.page.footer .illustrazione {width:30%;display:block;clear:both;margin:30px auto 0 auto;}
/* .page.pranzo .illustrazione {width:60%;} */

.navigation a.active.annuncio-icon, .navigation a:hover.annuncio-icon {color:#FF1111;}
.page.annuncio {background-color:#FFFFFF;padding-top:100px;color:#444444;}
.page.annuncio::after {background-image:;}
.page.annuncio .button {background-color:#444444;}
.page.annuncio .fold {border-color:#444444;}
.page.annuncio {background-repeat:no-repeat;background-size:cover;}
.page.annuncio h1 {font-family:"Satisfy";font-size:4em;text-align:center;font-weight:bold;margin:20px 20px 20px 20px;}
.page.annuncio h1 i {font-size:0.6em;font-weight:normal;}
.page.annuncio h1 a {color:#444444;text-decoration:none;}
.page.annuncio .data-luogo {font-family:"Satisfy";font-size:2.3em;margin:0 20px;font-weight:normal;font-style:;margin-top:30px;}
.page.annuncio input[type=text], input[type=email]  {background-color:#FAFAFA;border:1px solid #AAAAAA;}

.navigation a.active.cerimonia-icon, .navigation a:hover.cerimonia-icon {color:#F9A435;}
.page.cerimonia {background-color:#F9A435;border-top-color:#FFFFFF;color:#333333;}
.page.cerimonia::after {background-image:;}
.page.cerimonia .button {background-color:#663300;}
.page.cerimonia .fold {border-color:#333333;}

.navigation a.active.pranzo-icon, .navigation a:hover.pranzo-icon {color:#7AC889;}
.page.pranzo {background-color:#7AC889;border-top-color:#F9A435;color:#122C17;}
.page.pranzo::after {background-image:;}
.page.pranzo .button {background-color:#104000;}
.page.pranzo .fold {border-color:#444444;}

.navigation a.active.alberghi-icon, .navigation a:hover.alberghi-icon {color:#5FA1CF;}
.page.alberghi {background-color:#5FA1CF;border-top-color:#7AC889/*#7AC889*/;color:#FFFFFF;}
.page.alberghi::after {background-image:;}
.page.alberghi .button {background-color:#457cbf;text-align:left;}
.page.alberghi .button > svg {margin-top:10px;}
.page.alberghi .button .hotel-name {display:block;text-align:left;font-size:1em;font-weight:bold;margin-top:10px;}
.page.alberghi .button .hotel-info {text-align:left;font-size:0.7em;font-weight:normal;margin-top:4px;}
.hotel-type {font-size:0.8em;font-weight:normal;}
.little-icon svg {width:16px !important;height:16px;margin:3px 10px 0 0 !important;padding:0;}

.navigation a.active.regali-icon, .navigation a:hover.regali-icon {color:#C3B731;}
.page.regali {background-color:#C3B731;border-top-color:#5FA1CF;color:#444444}
.page.regali::after {background-image: ;}
.page.regali .button {background-color:#B28500;min-width:400px;margin-top:0;margin-bottom:20px;}
.page.regali h2, .page.regali p {}
.page.regali label {text-align:right;margin-top:-40px;}
.page.regali input[type=text], .page.regali input[type=email] {background-color:#FFFFFF;}
.page.regali form-container {display:block;width:100%;padding:0;margin:0;}

.navigation a.active.news-icon, .navigation a:hover.news-icon {color:#E88490;}
.page.news {background-color:#E88490;border-top-color:#C3B731;color:#FFFFFF;}
.page.news::after {background-image:;}
.page.news .button {background-color:#CC3446;}

.navigation a.active.credits-icon, .navigation a:hover.credits-icon {color:#AAAAAA;}
.page.credits {background-color:#EEEEEE;border-top-color:#E88490;color:#444444;}
.page.credits::after {}
.page.credits .button {background-color:#444444;}

.page.footer {background-color:#FFFFFF;border-top-color:#EEEEEE;color:#444444;}
.page.footer::after {}
.page.footer .button {background-color:#330000;}

.hidden-sebi {display:none;position:absolute;right:10px;top:-116px;width:100px;}

.page .text-orario {
	margin:20px 0;
	font-family:"Yanone Kaffeesatz";
	font-size:3em;
	font-weight:bold;
}
.page .text-info {
	margin:10px 0;
	font-family:"Yanone Kaffeesatz";
	font-size:1.8em;
	font-weight:normal;
}

.deco {position:absolute;width:120px;height:120px;}
.deco svg {width:100%;height:100%;}
.deco.angle-tl {left:20px;top:20px;}
.deco.angle-tr {right:20px;top:20px;}
.deco.angle-bl {left:20px;bottom:20px;}
.deco.angle-br {right:20px;bottom:20px;}
.deco.angle-tr svg {transform: translate(120, 0); transform:scale(-1, 1);}
.deco.angle-bl svg {transform: translate(0, 120); transform:scale(1, -1)}
.deco.angle-br svg {transform: translate(120, 120); transform:scale(-1, -1);}

.map	{position:relative;background-position:50%  50%; background-size:cover;color:#000000;max-width:500px;width:60%;height:200px;overflow:hidden;}
.map svg {margin-top:10px;;}
.map-cerimonia {background-image:url(../../images/maps/map-cerimonia.jpg);}
.map-pranzo {background-image:url(../../images/maps/map-pranzo.jpg);}

.map span {position:absolute;bottom:0;width:auto;right:0;left:0;padding:5px;background-color:rgba(255,255,255,0.6);}

.egg {display:none;}

/* LIGHTBOX */
#lightbox {display:none;width:100%;height:100%;margin:0;padding:0;top:0;bottom:0;left:0;right:0;position:fixed;background-color:rgba(0,0,0,0.7);z-index:10;}
#lightbox img {
	max-width: 90%;
	max-height: 90%;
	position: fixed;
	top: 50%;
	left: 50%;
	/* bring your own prefixes */
	transform: translate(-50%, -50%);
	border-radius:20px;
	/* border:4px solid #444444; */
	-webkit-box-shadow: 0px 1px 13px 0px rgba(0, 0, 1, 0.72);
-moz-box-shadow:    0px 1px 13px 0px rgba(0, 0, 1, 0.72);
box-shadow:         0px 1px 13px 0px rgba(0, 0, 1, 0.72);
}
  
/* FROMBOTTOM ANIMATION */
#frombottom {
	display:block !important;
	position:fixed;
	bottom:-600px;
	right:30px;	
	-webkit-transition: all 500ms ease-out;
    -moz-transition: all 500ms ease-out;
    -o-transition: all 500ms ease-out;
    transition: all 500ms ease-out;
}
#frombottom.visible {
	display:block;
	bottom:0;
	-webkit-transition: all 500ms ease-out;
    -moz-transition: all 500ms ease-out;
    -o-transition: all 500ms ease-out;
    transition: all 500ms ease-out;	
} 
#frombottom img {display:block;max-width:400px;}

@media only screen and (max-width: 1024px) {
	.page .illustrazione {width:70%;}
	.page.annuncio .illustrazione {width:70%;}
	.page.cerimonia .illustrazione {width:36%;}
	.page.regali .illustrazione {width:40%;}
	.page.credits .illustrazione {width:40%;}
	.page.footer .illustrazione {width:40%;}
}
@media only screen and (max-width: 768px) {
	.deco {display:none;}
	.page.illustrazione {width:80%;}
	.page.annuncio .illustrazione {width:80%;}
	.page.cerimonia .illustrazione {width:50%;}	
	.page.regali .illustrazione {width:50%;}
	.page.credits .illustrazione {width:50%;}
	.page.footer .illustrazione {width:50%;}
	.map {width:80%;}
	.fold {padding:90px 10px 10px 10px;}
	.page.regali .button {background-color:#B28500;}
	
}
@media only screen and (max-width: 510px) {	
	.page.regali .button {min-width:auto;}
	.button, .map {width:100%;margin-left:0;margin-right:0;margin-top:20px;margin-bottom:0;min-width:none;}
	.fold {padding:20px;} 
	input[type=text], input[type=email] {max-width:none;}
	.page.regali input[type=text], .page.regali input[type=email] {width:100%;margin-left:0;margin-right:0;margin-bottom:20px;}
}

@media only screen and (max-width: 480px) {
		
	.page {padding:20px;}
	.page h2  {font-size:3.4em;}
	.page .subtitle  {font-size:1.6em;}	
	.page .illustrazione {width:80%;}
	.page.annuncio .illustrazione {width:80%;}
	.page.cerimonia .illustrazione {width:60%;}
	
	.page.regali .illustrazione {width:80%;}
	.page.credits .illustrazione {width:80%;}	
	.page.footer .illustrazione {width:80%;}	
	.page.annuncio h1 {font-size:2.8em;margin:0 20px 10px 20px;}
	.page.annuncio .data-luogo {font-size:2.0em;margin:10px 20px 0 20px;}
}

@media only screen and (max-width: 380px) {
	
	.page .illustrazione {width:90%;}
	.page.regali .illustrazione {width:80%;}
	.page.credits .illustrazione {width:80%;}
	.page.footer .illustrazione {width:80%;}
	.page.annuncio .illustrazione-prima {width:90%;}
	.page.cerimonia .illustrazione {width:70%;}
	
	.mobile #header {
		height:84px;
	}
	.mobile #navigation {
		height:84px;
		padding-top:20px;
	}
	.mobile #navigation a {
		margin-right:0px;margin-bottom:8px;width:30px;
	}
	
}