@font-face {
  font-family: "Caviar Dreams";
  src: url("CaviarDreams.ttf");
}
body {
	background-color:	rgb(46, 46, 46);
	background-attachment:fixed;	background-repeat:	no-repeat;
	color:			rgb(255, 255, 255);
	font-family:		"Caviar Dreams", "Arial", "Helvetica", sans-serif;
}

header {
		position: fixed;
		font-size: 2em;
		top: 0;
		right: 1em;
		left: 1em;
		z-index: 10;
	}
h2{
	font-variant: small-caps;
}

.div_navigation{
	box-sizing: border-box; 
	width: 100%;
	text-align: left;
	padding: 0.75em 0 0.75em 0.25em;
}

.div_navigation:hover{
	background-color: rgba(255, 255, 255, 0.1);
}
	
.button_vn{	
	width: 100%; 
	height: 100%; 
	background-repeat: none;
	background-color: rgba(0,0,0,0); 	
	border: 0;
}

.button_foto{
	width: 100%; 
	height: 100%;	
	background-repeat: none;
	background-color: rgba(0,0,0,0);
	border: 0;
}

.button_foto:hover{	
	cursor: zoom-in;
}

.button_vn:hover{	
	cursor: zoom-in;
}

.button_link{
	width: 100%; 
	height: 100%;	
	background-repeat: none;
	background-color: rgba(0,0,0,0);
	border: 0;
}

.button_link:hover{	
	cursor: pointer;
}

.button_menu{
	width: 100%; 
	height: 100%;	
	background-repeat: none;
	background-color: rgba(0,0,0,0);
	border: 0;
	color:			rgb(255, 255, 255);
	font-family:		"Caviar Dreams", "Arial", "Helvetica", sans-serif;
}

.button_menu:hover{	
	cursor: pointer;
}

td.header{
	border-collapse: collapse;
	border-top: 0.5em solid rgb(46,46,46);
	background-color: rgb(56,56,56);
	vertical-align: middle;
	padding: 0;
}


table.price{
	width: 100%;
}

table.price th{
	background-color:rgba(255,255,255,0.05);
	font-variant: small-caps;
	font-size: larger;
	text-align: left;
}
table.price td:first-of-type{
	padding: 0.5em 0 0 1em;
	
}
table.price td:nth-of-type(2n){
	text-align: right;
	padding: 0.5em 0 0 0;
}

table.price td:nth-of-type(3n){
	text-align: center;
	padding: 0.5em 1em 0 0;
}


@media screen and (min-device-width: 320px) {
	header {
		position:absolute;
		font-size: 0.75em;
		top: 0;

	}
	body {
		background-position: center 11em;
		font-size: 14px;
		margin: 8em 1.5em 8em 1.5em;
	}
	footer {
		font-size: 0.75em;
		position: fixed;
		bottom: 0;
		right: 1em;
		left: 1em;
	}
	
	.anchor{
		z-index: -100;
		color: rgba(0,0,0,0);
		padding: 11em 0 0 0;
	}
	.logo{
		max-height: 3em;
	}
	.logo_lb{
		max-height: 1em;
	}
	
	.button_menu{
		max-width: 60px;
	}
	
	.top{
		max-width: 60px;
	}

}


@media screen and (min-device-width: 1000px){
	header{
		font-size: 1.5em;
	}
	
	body {
		background-image:	url("background.png");
		background-position: center 3em;
		font-size: 16px;
		margin: 9em 1.5em 15em 1.5em;
	}
	footer {
		font-size: 16px;
		position: fixed;
		bottom: 0;
		right: 1em;
		left: 1em;
	}
	.anchor{
		z-index: -100;
		color: rgba(0,0,0,0);
		padding: 12em 0 0 0;
	}
	.logo{
		height: 12em;
	}
	.logo_lb{
		height: 3em;
	}
	
	.top{
		max-width: 100px;
	}

}

@media screen and (min-device-width: 1000px) and (min-device-height: 1081px){
	header{
		font-size: 2em;
		top: 0;
	}
	
	body {
		background-position: center 12em;
		font-size: 16px;
		margin: 15em 1.5em 15em 1.5em;
	}
	footer {
		font-size: 16px;
		position: fixed;
		bottom: 0;
		right: 1em;
		left: 1em;
	}
	
	.anchor{
		z-index: -100;
		color: rgba(0,0,0,0);
		padding: 12em 0 0 0;
	}
	.logo{
		height: 12em;
	}
	.logo_lb{
		height: 3em;
	}

}




td.footer{
	border-collapse: collapse;
	border-top: 0.5em solid rgb(46,46,46);
	background-color: rgb(56,56,56);
	vertical-align: center;
	padding: 0.5em 2em 0.5em 2em;
}


a:link, a:active, a:visited, a:focus {
	color:			rgb(255, 255, 255);
	text-decoration:	none;
}

a:hover {
	color:			rgb(255, 255, 255);
	text-decoration:	none;
}



a.navigation:link, a.navigation:active, a.navigation:visited, a.navigation:focus {

	color:			rgb(246, 81, 101);
}

a.navigation:hover {
	color:			rgb(246, 0, 29);
	text-decoration:	none;
}


.group, 
[class*=colgroup] { 
	zoom:1;
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	flex-wrap: wrap;
	max-width: 1400px;
	margin: 0 auto;
} 
.group:after,
[class*=colgroup]:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden
	
}

.col, .col_navigation { 
	position:relative; 
	box-sizing: border-box; 
	background-color: rgba(255, 255, 255, 0.05);
	padding: 1em;
	margin-top: 0.5em;
}
.col :first-child { margin-top:0}

@media all and (min-width: 5em) and (max-width: 49.9em) {
	[class*=colgroup] .col {
		float:left;
		width:100%;
	}

	[class*=colgroup] .col:nth-of-type(2n+1),
	.colspan-2+.col {
		clear:left;
		margin-left:0
	}

	.colgroup-1 .col {
		width:100%;
		float:none;
		margin-left:0
	}

	.colgroup-3 .colspan-2,
	.colgroup-3 .colspan-2+.col,
	.colgroup-3 .col.primary,
	.colgroup-3 .col.secondary {
		width:100%;
		float:none;
		margin-left:0
	}

	.colgroup-3 .col.secondary { margin:2em 0 0 0 }
	
	.menu{
		visibility: visible;
		width: 85px;
	}
	
	.colgroup_navigation .col_navigation {
		display: none;
	}
	.colgroup_navigation .col_content{
		width: 100%;
		clear:left;
		padding: 0;
		background-color: transparent;
	}
}



@media all and (min-width: 50em) {
	body {  }
	[class*=colgroup] .col, .col_content {
	margin-left:1%;
	float:left;
	
	}

	[class*=colgroup] .col:first-of-type { margin-left:0 }
	.colgroup-4 .col { width:24.25% }
	.colgroup-4 .col:nth-of-type(4n+1) {
		clear:left;
		margin-left:0
	}

	.colgroup-4 .col.colspan-3 { width:73.8%}
	.colgroup-3 .col { width:32.66%}
	.colgroup-3 .col:nth-of-type(3n+1) {
		clear:left;
		margin-left:0
	}

	.colgroup-3 .col.colspan-2 { width:64% }
	.colgroup-3 .col.middle {
		margin:0 auto;
		float:none
	}

	.colgroup-3 .col.colspan-2>p {
		line-height:1.4;
		margin-top:0.7em
	}

	.colgroup-3 .col.primary { float:right }
	.colgroup-3 .col.secondary {
		float:left;
		margin-left:0
	}

	.colgroup-2 .col { width:49.5%}
	.colgroup-2 .col:nth-of-type(2n+1) {
		clear:left;
		margin-left:0
	}
	.colgroup-2_1 .col-2_1 { 
		width:32.5%;
		padding: 0;
		background-color: transparent;
	}
	.colgroup-2_1 .col-2_1:nth-of-type(2n+1) {
		width:66.5%;
		clear:left;
		margin-left:0;
		padding: 0;
		background-color: transparent;
	}
	.col-2_1 .col { 
		width: 100%;
		margin-left: 0;
	}
	
	.colgroup-1 .col {
		width:100%;
		margin-left:0
	}
	
	.colgroup-1 .colgroup-2 .col { 
		width:49.5%;
		margin-left:1%;
		margin-top: 0.5em;
		float:left;
	}
	.colgroup-1 .colgroup-2 .col:nth-of-type(2n+1) {
		clear:left;
		margin-left:0;
	}
	
	.colgroup_navigation .col_navigation {
		width: 175px;
		padding: 0;
	}
	.colgroup_navigation .col_content{
		width: calc(99% - 175px);
		clear:left;
		padding: 0;
		background-color: transparent;
	}
	
	.menu{
		display: none;
	}
}