/* RESET */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}

body, html {
	padding:  0px;
	margin:  0px;
	width: 100%;
	height:  100%;
	background:  url( '../images/bg1.jpg' );
	background-size: cover;
}

.left {
	float: left;
}

.spacer {
	clear: both;
}

.social-share {
	margin-top:  50px;
	margin-left: 20px;
}


@yellow1: #fedc6b;
@yellow2: #efc33a;

#page {
	width: 850px;
	margin: 0 auto;
	
	#russia {
		position: absolute;
		top: 5%;
	}

	.container {
		position:  absolute;
	}

	#hello {
		width: 850px;
		font-family: MonoCondensed-Bold;
		padding-top: 10%;
		text-align: justify;
		color: #ffffff;

		a {
			color: @yellow2;
		}

		div {
			padding-bottom: 20px;
			width: 600px;
			margin: 0 auto;

			&:last-child {
				padding: 0px;
			}
		}

		.one {
			font-size: 65px;
			color: @yellow2;
		}

		.two {
			font-size: 30px;
			line-height: 36px;
		}

		.three {
			font-size: 20px;
			line-height: 24px;
		}

		#go {
			font-size: 65px;
			color: @yellow2;
			cursor: pointer;
			text-align: center;
			text-decoration: underline;

			&:hover {
				color: @yellow1;
			}
		}
	}
	
	#choose {
		display: none;
		padding-top: 10%;
		
		.title {
			font-family: Gothic725BlkBT;
			font-size: 31px;
			line-height: 38px;
			color: #ffffff;
			margin: 20px 0px;
		}
		
		@pHeight: 37px;
		@pWidth: 500px;
		#picker {
			padding: 10px;
			background: rgba( 255, 255, 255, 0.3 );
			
			#des {
				position:  absolute;
				margin-left: 570px;
				margin-top:  10px;
			}
			
			.choice {
				height: @pHeight;
				line-height: @pHeight;
				width: @pWidth;
				font-family: MonoCondensed-Bold;
				font-size:  31px;
			}
			
			.button {
				width:  37px;
				height:  37px;
				background:  url( '../images/button.png' );
				cursor: pointer;
				
				&:hover {
					background:  url( '../images/button_h.png' );
				}
			}
		}
		
		#places {
			width: 557px;
			background: rgba( 255, 255, 255, 0.3 );
			height:  200px;
			overflow-x: hidden;
			
			.place {
				height: @pHeight;
				line-height: @pHeight;
				border-top: @yellow1 1px solid;
				color:  #ffffff;
				cursor: pointer;
				padding-left: 10px;
				font-family: MonoCondensed-Bold;
				font-size: 20px;
				
				&:hover {
					color: #000000;
					background: @yellow1;
				}
			}
		}
	}
	
	#wait {
		display: none;
		font-family: MonoCondensed-Bold;
		font-size: 20px;
		line-height: 24px;
		color: #ffffff;
		text-align: center;
		top: 30%;
		width:  850px;
	}
	
	#result {
		width: 850px;
		display: none;
		padding-top: 10%;
		
		.left {
			width: 233px;
			
			&:first-child {
				width: 617px;
			}
		}
		
		#to {
			color: @yellow2;
			font-family: Gothic725BlkBT;
			font-size: 30px;
			line-height: 36px;
			width:  500px;
		}
		
		#about {
			color: @yellow2;
			font-family: MonoCondensed-Bold;
			font-size: 20px;
			line-height: 24px;
			margin: 50px 0px;
			width: 400px;
			
			a {
				color: @yellow2;
			}
		}
		
		#nets {
			margin-bottom: 50px;
		
			img {
				cursor: pointer;
			}
		}
		
		#again {
			cursor: pointer;
			width: 300px;
			height: 63px;
			background:  url( '../images/redo.png' );
			
			&:hover {
				background:  url( '../images/redo_hover.png' );
			}
		}
		
		#buy {
			margin-top: 30px;
			background: rgba( 255, 255, 255, 0.3 );
			border: @yellow2 1px solid;
			text-align: center;

			&:hover {
				background: rgba( 255, 255, 255, 0.6 );
			}
		
			a {
				color: @yellow2;
				font-family: MonoCondensed-Bold;
				font-size: 22px;
				padding: 10px 15px;
				display: block;
			}
		}
		
		.ticket {
			position:  absolute;
			color: @yellow2;
			font-family: MonoCondensed-Bold;
			font-size: 20px;
		}
	}
}

#logo {
	width:  100%;
	height:  27px;
	background-color: rgba( 255, 255, 255, 0.2 );
	position:  absolute;

	a {
		float: right;
		margin-top: 5px;
		margin-right: 5px;
	}
}

.jspTrack {
	background: rgba( 255, 255, 255, 0.3 );
}

.jspVerticalBar {
	background: transparent!important;
	width: 8px!important;
}

.jspDrag {
	background: @yellow2!important;
	width: 8px!important;
	height: 35px!important;
}

.jspCap {
}

.jspCapBottom {
}