﻿
/* type 1 */
.type-1 {
	-moz-perspective: 1000;
	-webkit-perspective: 1000;
	-ms-perspective: 1000;
	
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	
	/*-webkit-transform: scale(0.1);
	-moz-transform: scale(0.1);
	-ms-transform: scale(0.1);*/
	
    -webkit-transform: scale(1.0);
	-moz-transform: scale(1.0);
	-ms-transform: scale(1.0);

	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-ms-transition: all 0.2s ease-in;
	
	width:auto;  /*798px;*/
	height: auto; /*598px;*/
	background: #343434;
	border: 7px solid #fff;
	box-shadow: inset 0px 0px 10px rgba(0,0,0,0.5), 0px 0px 20px rgba(0,0,0,0.2);
	border-radius: 10px;
	opacity: 1;
	padding: 10px;
	color: #fff;
	font-weight: bold;
	font-size: 22px;
	font-family: Arial, sans-serif;
	position: absolute;
	left: 25%;
	top: 25%;
	/* Always on top */
	z-index: 9999999;
}
.divContainer .type-1 {
	-moz-perspective: 1000;
	-webkit-perspective: 1000;
	-ms-perspective: 1000;
	
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	
	-webkit-transform: scale(0.1);
	-moz-transform: scale(0.1);
	-ms-transform: scale(0.1);
	
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-ms-transition: all 0.2s ease-in;
	
	width: 780px;
	height: 580px;
	background: #343434;
	border: 7px solid #fff;
	box-shadow: inset 0px 0px 10px rgba(0,0,0,0.5), 0px 0px 20px rgba(0,0,0,0.2);
	border-radius: 10px;
	opacity: 0;
	padding: 10px;
	color: #fff;
	font-weight: bold;
	font-size: 22px;
	font-family: Arial, sans-serif;
	position: absolute;
	left: -10px;
	top: -80px;
	/* Always on top */
	z-index: 9999999;
}

/* A little triangle, to give context */
.divContainer .type-1:after {
	width: 0;
	height: 0;
	content: "";
	color: #fff;
	border: 14px solid;
	border-color: white transparent transparent transparent;
	position: absolute;
	/* You may need to change the positioning if you restyle the dialogue */
	bottom: -33px;
	left: 50%;
}

.divContainer input {
	display: none;
}

.divContainer input:checked + .type-1 {
	opacity: 1;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
}

.divContainer {
	width: 800px;
    height:600px;
	margin: 0px auto;
	position: relative;
	top: 100px;
	text-decoration: none;
}

.divContainer label {
	position: relative;
	border-bottom: 2px solid #000;
	margin: 0px auto;
	color: #000;
	cursor: pointer;
	font: 40px 'Istok Web', sans-serif;
	opacity: 0.7;
}

/* type 2 

.type-2 {
	-moz-perspective: 1000;
	-ms-perspective: 1000;
	-webkit-perspective: 1000;
	
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	
	-webkit-transform: scale(0.1);
	-moz-transform: scale(0.1);
	-ms-transform: scale(0.1);
	
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-ms-transition: all 0.2s ease-in;
	
	width: 300px;
	height: 25px;
	background: #eee;
	border: 1px solid #b1b1b1;
	border-radius: 7px;
	opacity: 0;
	padding: 20px;
	color: #343434;
	position: absolute;
	left: 100%;
	top: 0px;
	z-index: 9999999;
	font: normal normal 22px Arial, sans-serif;
	box-shadow: inset 0px 40px 60px -30px rgba(255,255,255,1), 0px 0px 20px rgba(0,0,0,0.2);
}

.type-2:after, .type-2:before {
	width: 0;
	height: 0;
	content: "";
	border: 14px solid;
	border-color: transparent #eee transparent transparent;
	position: absolute;
	bottom: 20px;
	left: -27px;
}

.type-2:before {
	left: -28px;
	border-color: transparent #b1b1b1 transparent transparent;
}
    */
/* 
.divContainer-2 input {
	display: none;
}

.divContainer-2 input:checked + .type-2 {
	opacity: 1;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	font-variant: normal;
}

.divContainer-2 {
	width: 280px;
	margin: 0px auto;
	position: relative;
	top: 150px;
}

.divContainer-2 label {
	position: relative;
	border-bottom: 2px solid #000;
	margin: 0px auto;
	color: #000;
	cursor: pointer;
	font: 40px 'Istok Web', sans-serif;
	opacity: 0.7;
}


------- IGNORE 

#header {
	width: 100%;
	margin: 0px auto;
}

#header #center {
	text-align: center;
}

#header h1 span {
	color: #000;
	display: block;
	font-size: 50px;
}

#header p {
	font-family: 'Georgia', serif;
}
#header h1 {
	color: #892dbf;
	font: bold 40px 'Bree Serif', serif;
}
*/
#travel {
	padding: 10px;
	background: rgba(0,0,0,0.6);
	border-bottom: 2px solid rgba(0,0,0,0.2);
	font-variant: normal;
	text-decoration: none;
}

#travel a {
	font-family: 'Georgia', serif;
	text-decoration: none;
	border-bottom: 1px solid #f9f9f9;
	color: #f9f9f9;
}
