﻿ Eric Meyer's CSS 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;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	margin:0;
}
	
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;
}
/* End of Eric Meyer's CSS Reset */

article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
	display: block;
}

html{
	width:100%;
	height:100%;
}

body {
	line-height: 1.3;

	font-family:"Microsoft JhengHei", "微軟正黑體", "Apple LiGothic Medium", "蘋果儷中黑", "Lucida Grande", "Lucida Sans Unicode", Helvetica;
	font-size:10pt;

	width:100%;
	height:100%;
}
* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;

  /*-webkit-transition: 0.3s;
  transition: 0.3s;*/
}
a{
	text-decoration: none;
	color:inherit;
	-webkit-transition: 0.2s; /* Safari */
    transition: 0.2s;
    cursor: pointer;
}
a:hover{
	color:#73cde5;
}

.wrapper {
	width:100%;
	height:100%;
	overflow-y:hidden;
	background-color: #13b1e2;
}

/* Header
-----------------------------------------------------------------------------*/
.header {
	width:100%;
	overflow: hidden;
	position: absolute;
	z-index: 2;
}
	.headerBar{
		width:100%;
		height:15px;
		background-color:#FFF;
		-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.4);
		-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.4);
		box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.4);
	}
	.logoBar{
		width:640px;
		height:80px;
		background: url(../images/logoBar.png) no-repeat center center;
	}

/* Middle
-----------------------------------------------------------------------------*/

/* Map Page */
.mapPage{
	overflow: hidden;
	position: absolute;

	width:100%;
	height:100%;

	background-color: #13b1e2;
	background: url(../images/map.png) no-repeat center center;

	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;

	opacity: 0;
	-webkit-transition:opacity 2s; /* Safari */
	transition:opacity 2s;
	-webkit-transition-delay: .5s; /* Safari */
    transition-delay: .5s;
}
	.mapText{
		position: absolute;
		z-index: 1;
		top:18%;
		left:8%;

		width:45%;
		min-width: 240px;
		height: 100px;

		color:#FFF;

		opacity: 0;
		-webkit-transition:opacity 2s; /* Safari */
		transition:opacity 2s;
		-webkit-transition-delay: 1s; /* Safari */
    	transition-delay: 1s;
	}
		.mapTitle{
			font-size: 24pt;
			text-shadow: 0px 0px 4px rgba(0,0,0,0.3);
		}
		.mapInfo{
			margin-top:5px;
			font-size: 13pt;
			-webkit-transition: 0.3s; /* Safari */
    		transition: 0.3s;
		}
		@media screen and (max-width:599px) {
			.mapInfo{
				font-size: 10.5pt;
			}
		}

	.map{
		position: relative;
		min-width:960px;
		min-height:560px;

		background: url(../images/map.png) no-repeat center center; 
	}
		.zoneLabel{
			position: absolute;
			color:#FFF;
			font-size: 12pt;
			font-weight: 600;
		}
			#zlabel_1{
				left:583px;
				top:425px;
			}
			#zlabel_2{
				left:728px;
				top:100px;
			}
			#zlabel_3{
				left:705px;
				top:205px;
			}
			#zlabel_4{
				left:120px;
				top:465px;
			}
			#zlabel_5{
				left:280px;
				top:512px;
			}
			#zlabel_6{
				left:378px;
				top:345px;
			}
		.object{
			position: absolute;
		}
		.object img{
			position: absolute;
			z-index: 0;
			/*-webkit-filter: brightness(2);
    		filter: brightness(2);*/
    		-webkit-transition: 0.5s;
  			transition: 0.5s;
		}
			#obj_1{
				top:272px;
				left:526px;
			}
			#obj_2{
				top:53px;
				left:620px;
			}
			#obj_3{
				top:120px;
				left:568px;
			}
			#obj_4{
				top:407px;
				left:134px;
			}
			#obj_5{
				top:441px;
				left:188px;
			}
			#obj_6{
				top:375px;
				left:292px;
			}
			/* click area */
			.detectArea{
				position: absolute;
				z-index: 1;
				/*background:#FFF;*/
				cursor: pointer;
			}
				#area_1{
					top:10px;
					left:10px;
					width:80px;
					height:180px;
				}
				#area_1_2{
					top:90px;
					left:90px;
					width:100px;
					height:70px;
				}
				#area_2{
					top:0px;
					left:0px;
					width:100px;
					height:80px;
				}
				#area_3{
					top:15px;
					left:5px;
					width:130px;
					height:145px;
				}
				#area_4{
					top:30px;
					left:10px;
					width:70px;
					height:145px;
				}
				#area_4_2{
					top:0px;
					left:40px;
					width:150px;
					height:50px;
				}
				#area_4_3{
					top:50px;
					left:80px;
					width:40px;
					height:40px;
				}
				#area_5{
					top:50px;
					left:20px;
					width:70px;
					height:110px;
				}
				#area_5_2{
					top:10px;
					left:60px;
					width:140px;
					height:80px;
				}
				#area_6{
					top:0px;
					left:0px;
					width:100px;
					height:40px;
				}

			.graphic{
				position: absolute;
				pointer-events:none;
				z-index: 1;
			}
				#a1{
					top:30px;
					left:20px;
					width:18px;
					height:30px;
					background: url(../images/graphic_a-01.png) no-repeat center center;
				}
				#a2{
					position: absolute;
					top:78px;
					left:85px;
					width:18px;
					height:30px;
					background: url(../images/graphic_a-01.png) no-repeat center center; 
				}
				#a3{
					position: absolute;
					top:110px;
					left:105px;
					width:79px;
					height:46px;
					background: url(../images/graphic_a-02.png) no-repeat center center; 
				}
				#a4{
					position: absolute;
					top:115px;
					left:150px;
					width:17px;
					height:14px;
					background: url(../images/graphic_a-03.png) no-repeat center center; 
					
					animation-name: zone1Ani;
					animation-iteration-count: infinite;
			    	animation-duration: 3s;
				}
					@keyframes zone1Ani {
					    0%   {top: 115px; left: 150px; opacity: 0}
					    20%  {left: 160px; opacity: 1}
					    /*40%  {left: 158px; opacity: 1}*/
					    60%  {left: 140px; opacity: 1}
					    80%  {top: 95px; left: 150px; opacity: 0}
					    100% {opacity: 0}
					}
				#b1{
					top:10px;
					left:50px;
					width:16px;
					height:27px;
					background: url(../images/graphic_b-01.png) no-repeat center center;
				}
				#b2{
					top:38px;
					left:8px;
					width:85px;
					height:35px;
					background: url(../images/graphic_b-02.png) no-repeat center center;
				}
				#b3{
					top:0px;
					left:10px;
					width:82px;
					height:80px;
					overflow: hidden;
				}
					#b3_1{
						top:29px;
						left:0px;
						width:70px;
						height:37px;
						background: url(../images/graphic_b-03.png) no-repeat center center;
						
						animation-name: zone2Ani;
						animation-iteration-count: infinite;
				    	animation-duration: 5s;
					}
						@keyframes zone2Ani {
						    0%   {top: 0px; left: 90px;}
						    100% {top: 57px; left: -80px;}
						}
				#b4{
					top:40px;
					left:0px;
					width:21px;
					height:35px;
					background: url(../images/graphic_b-04.png) no-repeat center center;
				}
				#b5{
					top:16px;
					left:80px;
					width:21px;
					height:35px;
					background: url(../images/graphic_b-04.png) no-repeat center center;
				}
				#c1{
					top:68px;
					left:11px;
					width:117px;
					height:70px;
					background: url(../images/graphic_c-03.png) no-repeat center center;
					background: url(../images/graphic_c-02.png) no-repeat center center;
					background: url(../images/graphic_c-01.png) no-repeat center center;
					
					-webkit-transition: none;
  					transition: none;

					animation-name: zone3Ani;
					animation-iteration-count: infinite;
			    	animation-duration: 4s;
				}
					@keyframes zone3Ani {
					    0%  {background-image:url("../images/graphic_c-01.png");}
					    5%  {background-image:url("../images/graphic_c-02.png");}
					    30% {background-image:url("../images/graphic_c-02.png");}
					    35% {background-image:url("../images/graphic_c-03.png");}
					    60% {background-image:url("../images/graphic_c-03.png");}
					    65% {background-image:url("../images/graphic_c-01.png");}
					    100%{background-image:url("../images/graphic_c-01.png");}
					}
				#d1{
					top:30px;
					left:45px;
					width:95px;
					height:40px;
					background: url(../images/graphic_d-01.png) no-repeat center center;
				}
				#d2{
					top:10px;
					left:64px;
					width:77px;
					height:60px;
					overflow: hidden;
				}
					#d2_1{
						top: -16px;
						left: 90px;
						width:53px;
						height:36px;
						background: url(../images/graphic_d-02.png) no-repeat center center;
						-webkit-transition: none;
	  					transition: none;

						animation-name: zone4Ani;
						animation-iteration-count: infinite;
				    	animation-duration: 6s;
					}
						@keyframes zone4Ani {
						    0%   {top: -17px; left: 90px;}
						    100% {top: 41px; left: -80px;}
						}
				#d3{
					top:10px;
					left:130px;
					width:21px;
					height:35px;
					background: url(../images/graphic_d-03.png) no-repeat center center;
				}
				#e1{
					top:-300px;
					left:-800px;
					width:32px;
					height:35px;
					background: url(../images/graphic_e-01.png) no-repeat center center;
					
					-ms-transform: rotate(0deg); /* IE 9 */
				    -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
				    transform: rotate(0deg);

					animation-name: zone5Ani;
					animation-iteration-count: infinite;
				    animation-duration: 15s;
				}
					@keyframes zone5Ani {
						0%   {top: -400px; left: -800px;}
						30%  {top: -400px; left: -800px;-ms-transform: rotate(0deg);-webkit-transform: rotate(0deg);transform: rotate(0deg);}
						65%  {-ms-transform: rotate(5deg);-webkit-transform: rotate(5deg);transform: rotate(5deg);}
						75%  {-ms-transform: roate(-10deg);-webkit-transform: rotate(-10deg);transform: rotate(-10deg);}
						100% {top: 0px; left: 112px;-ms-transform: rotate(5deg);-webkit-transform: rotate(5deg);transform: rotate(5deg);}
					}

				#e2{
					top:-10px;
					left:45px;
					width:106px;
					height:77px;
					background: url(../images/graphic_e-02.png) no-repeat center center;
				}
				#f1{
					top:-28px;
					left:18px;
					width:40px;
					height:40px;
					background: url(../images/graphic_f-01.png) no-repeat center center;
					
					-ms-transform: rotate(0deg); /* IE 9 */
				    -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
				    transform: rotate(0deg);

					animation-name: zone6Ani;
					animation-iteration-count: infinite;
			    	animation-duration: 8s;
				}
					@keyframes zone6Ani {
					    0%   {-ms-transform: rotate(0deg);-webkit-transform: rotate(0deg);transform: rotate(0deg);}
						100% {-ms-transform: rotate(360deg);-webkit-transform: rotate(360deg);transform: rotate(360deg);}
					}
				#f2{
					top:-28px;
					left:18px;
					width:46px;
					height:45px;
					background: url(../images/graphic_f-02.png) no-repeat center center;
				}
		.zoneBtn{
			width:0px; /*120px*/
			height:0px;

			position:absolute;
			z-index:3;

			border-radius: 60px;
			background: #FFF;
			cursor: pointer;

			overflow: hidden;

			-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
			-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
			box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);

			-ms-transform: translate(-50%, -50%);
		   	-webkit-transform: translate(-50%, -50%);
		    transform: translate(-50%, -50%);

			-webkit-transition: 0.2s;
  			transition: 0.2s;

  			display: -webkit-flex;
  			display: flex;
  			-webkit-align-items: center;
			align-items: center;
			-webkit-justify-content: center;
			justify-content: center;

			color:#FFF;
			font-size: 18pt;
			font-weight: bold;
			white-space: nowrap;
			text-shadow: 0px 0px 4px rgba(0,0,0,0.7);
		}
			#zBtn_1{
				top:370px;
				left:585px;
				background: url(../images/btnImage-01.jpg) no-repeat center center; 
			}
			#zBtn_2{
				top:90px;
				left:670px;
				background: url(../images/btnImage-02.jpg) no-repeat center center; 
			}
			#zBtn_3{
				top:220px;
				left:645px;
				background: url(../images/btnImage-03.jpg) no-repeat center center; 
			}
			#zBtn_4{
				top:430px;
				left:180px;
				background: url(../images/btnImage-04.jpg) no-repeat center center; 
			}
			#zBtn_5{
				top:520px;
				left:300px;
				background: url(../images/btnImage-05.jpg) no-repeat center center; 
			}
			#zBtn_6{
				top:400px;
				left:330px;
				background: url(../images/btnImage-06.jpg) no-repeat center center; 
			}

		.photoBox{
			position:absolute;
			z-index: 4;

			left:300px;
			top:280px;

			opacity: 0;
			pointer-events: none;
			-webkit-transition: 0.2s; /* Safari */
    		transition: 0.2s;
		}
			.photoFrame{
				float:left;
				width:146px;
				height:170px;
				margin-right:10px;
				background:#FFF;
				cursor: pointer;

				-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
				-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
				box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
			}
			.photoImg{
				width:130px;
				height:130px;
				margin:8px;
				background-size:cover;
				background-position: center;
			}
			.photoName{
				width:130px;
				margin:0 8px;
				text-align: center;
			}

	/*----- lightBox ----- */
	.lightBox{
		width:100%;
		height:100%;
		position:fixed;
		z-index:3;

		left:0;
		top:0;
		background:rgba(0,0,0,0.7);

		color: #FFF;
		opacity: 0;
		pointer-events: none;

		-webkit-transition: 0.2s; /* Safari */
    	transition: 0.2s;
	}
		.lightBoxContent{
			position:relative;
			margin:0 auto;
			max-width: 960px;
			height:100%;
			padding:10px;

			display: -webkit-flex;
  			display: flex;
  			-webkit-align-items: center;
			align-items: center;
			-webkit-justify-content: center;
			justify-content: center;
		}
		.closeBtn{
			width:45px;
			height:45px;
			top:50px;
			right:50px;
			position:absolute;
			background: url(../images/closeBtn.png) no-repeat 50% center;
			cursor: pointer;
			-webkit-transition: 0.3s;
  			transition: 0.3s;
		}
		.closeBtn:hover{
			background: url(../images/closeBtn_b.png) no-repeat 50% center;
		}
		@media screen and (max-width:599px) {
			.closeBtn{
				top:20px;
				right:20px;
			}
		}
		.lightBtnLeft{
			-webkit-flex: 1;
          	flex: 1;
          	height:100px;
          	background: url(../images/arrowLeft.png) no-repeat 50% center;
          	cursor: pointer;
          	-webkit-transition: 0.3s;
  			transition: 0.3s;
		}
		.lightBtnLeft:hover{
			background: url(../images/arrowLeft.png) no-repeat 30% center;
		}
		.lightBtnRight{
			-webkit-flex: 1;
          	flex: 1;
          	height:100px;
          	background: url(../images/arrowRight.png) no-repeat 50% center;
          	cursor: pointer;
          	-webkit-transition: 0.3s;
  			transition: 0.3s;
		}
		.lightBtnRight:hover{
			background: url(../images/arrowRight.png) no-repeat 70% center;
		}
		.lightBoxMiddle{
			-webkit-flex: 5;
          	flex: 5;
		}
			.lightBoxTitle{
				margin:10px 0;
				text-align: center;
				font-size: 18pt;
			}
			.lightBoxText{
				margin-top: 5px;
				font-size: 11.5pt;
			}
			.lightBoxImg{
				max-width: 600px;
				max-height: 360px;
				margin:15px auto;
				overflow: hidden;
				background-size:cover;
				background-position: center;
				-webkit-transition: 0.3s;
  				transition: 0.3s;
			}
			.lightBoxImg img {
				float:left;
				width: 100%;
			    height:100%;
			}
			@media screen and (max-width:599px) {
				.lightBoxTitle{
					font-size: 14pt;
				}
				.lightBoxText{
					font-size: 10pt;
				}
				.lightBoxImg{
					max-height: 240px;
				}
			}
			.selectBtnOuter{
				margin:8% auto;
				width:150px;
				height:50px;
			}
				.selectBtn{
					width:150px;
					height:50px;
					background-image:url("../images/selectBtn.png");
					-webkit-transition: 0.2s; /* Safari */
			    	transition: 0.2s;
			    	cursor: pointer;
				}
				.selectBtn:hover{
					background-image:url("../images/selectBtn_b.png");
				}
/* On Top Overlay */

/* -- Nav Bar -- */
.votePageBtn{
	position: fixed;
	height:60px;
	right:15px;
	bottom:15px;
}
	.gotoMapBtn{
		float:left;
		width:40px;
		height:60px;
		margin-left:15px;

		background: #FFF url(../images/backBtn.jpg) center center no-repeat; 
		-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
		-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
		box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
		cursor: pointer;
		-webkit-transition: 0.3s;
  		transition: 0.3s;
	}
	.gotoMapBtn:hover{
		width:60px;
	}
	.mapBtn{
		float:left;
		width:100px;
		height:60px;
		margin-left:15px;

		background: url(../images/mapIcon.jpg) no-repeat center center; 
		-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
		-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
		box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
		cursor: pointer;
		-webkit-transition: 0.3s;
  		transition: 0.3s;
	}
	.mapBtn:hover{
		width:120px;
	}

.mapPageBtn{
	position: fixed;
	height:60px;
	right:15px;
	bottom:15px;
}
	.gotoVoteBtn{
		float:left;
		width:40px;
		height:60px;
		margin-left:15px;

		background: #FFF url(../images/nextBtn.jpg) center center no-repeat; 
		-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
		-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
		box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
		cursor: pointer;
		-webkit-transition: 0.3s;
  		transition: 0.3s;
	}
	.gotoVoteBtn:hover{
		width:60px;
	}
	.voteBtn{
		float:left;
		width:100px;
		height:60px;
		margin-left:15px;

		background:#FFF url(../images/voteIcon.jpg) no-repeat center center; 
		background-size:auto 100%;
		-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
		-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
		box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
		cursor: pointer;
		-webkit-transition: width 0.3s;
  		transition: width 0.3s;
	}
	.voteBtn:hover{
		width:120px;
	}

/* Vote Page */

.votePage{
	left:100%;
	position: relative;

	width:100%;
	display: none;
	background-color: #13b1e2;
}
	.voteContent{
		margin:0 auto;
		max-width: 960px;
		width: 100%;

		background-color: #FFF;
		-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
		-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
		box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
	}
		.votedItem{
			padding-top:120px;
			text-align: center;
		}
			.voteTitle{
				margin-bottom: 10px;
				font-size: 24pt;
			}
			.voteSubtitle{
				font-size: 14pt;
				margin:10px 20px;
			}
			.choiceSelection{
				margin-top:20px;
				margin-bottom:10px;
				display: -webkit-flex;
				display: flex;
				-webkit-align-items: center;
				align-items: center;
				-webkit-justify-content: center;
				justify-content: center;
			}
				.choiceFrame{
					margin:auto 2px;
					border:1px solid #FFF;
					-webkit-transition: 0.2s; /* Safari */
    						transition: 0.2s;
					box-shadow: none;
				}
					.choiceName{
						margin-top:8px;
						font-size: 14pt;
						overflow: hidden;
					}
					.locationThumb{
						float:left;
						width:60px;
						height:60px;
						margin:8px;
						background:#FFF url(../images/locationThumb-01.jpg) no-repeat center center; 
						display: -webkit-flex;
						display: flex;
						cursor: pointer;
					}
					#thumb_1 .locationThumb{
						background:#FFF url(../images/locationThumb-01.jpg) no-repeat center center; 
					}
					#thumb_2 .locationThumb{
						background:#FFF url(../images/locationThumb-02.jpg) no-repeat center center; 
					}
					#thumb_3 .locationThumb{
						background:#FFF url(../images/locationThumb-03.jpg) no-repeat center center; 
					}
					#thumb_4 .locationThumb{
						background:#FFF url(../images/locationThumb-04.jpg) no-repeat center center; 
					}
					#thumb_5 .locationThumb{
						background:#FFF url(../images/locationThumb-05.jpg) no-repeat center center; 
					}
					#thumb_6 .locationThumb{
						background:#FFF url(../images/locationThumb-06.jpg) no-repeat center center; 
					}
					.reselectedBtn{
						text-decoration: underline;
						cursor: pointer;
						-webkit-transition: 0.2s;
	  					transition: 0.2s;
					}
					.reselectedBtn:hover{
						color:#73cde5;
					}
				

	/* ----- Form ----- */
		.fontTitle{
			font-size: 16pt;
		}
		.sharing_form{
			width:100%;
			max-width:700px;
			margin:0 auto;

			padding:20px 30px;
			text-align: center;
		}
			.formInfo{
				width:100%;
				margin-bottom: 10px;
			}
			.formField{
				margin:20px auto;
				height:20px;
				max-width:700px;

				display: -webkit-flex;
	 			display: flex;
	 			font-size:12pt;
			}
			.fieldTitle{
				text-align: left;
				-webkit-flex: 1;
	          	flex: 1;
			}
			.textField{
				-webkit-flex: 4;
	          	flex: 4;
	          	max-height:70px;
			}

			.submitBtnOuter{
				margin:0 auto;
				width:150px;
				height:50px;
			}
				.submitBtn{
					width:150px;
					height:50px;
					background-image:url("../images/submitBtn.png");
					-webkit-transition: 0.2s; /* Safari */
			    	transition: 0.2s;
			    	cursor: pointer;
				}
				.submitBtn:hover{
					background-image:url("../images/submitBtn_b.png");
				}

		.terms{
			margin-top:10px;
			width:100%;
			padding:20px 30px;
			background-color:#FFF;
		}
			.termsTitle{
				border-top:2px dotted #999999;
				padding-top: 30px;
				color:#02488f;
				font-size: 11pt;
				font-weight:bold;
			}
		ol{
			list-style-type: decimal;
		}
		li{
			margin-bottom: 6px;
		}


/* Footer
-----------------------------------------------------------------------------*/
.footer{
    width:100%;

	min-height: 80px;
	padding:20px;
	background:#003571;
	font: 12px Arial, sans-serif;

	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
}
	.footerContent{
		width:960px;
		max-width:960px;
	}
	
	.footerText{
		float:left;
		color:#629fbe;
	}
	.footerLogo{
		float:right;
		
		width: 220px;
		height:28px;
		margin:12px 0 0 0;
	}
	@media screen and (max-width:599px) {
		.footerLogo{
			margin-bottom:0;
		}
	}


	/*animation: arrowAni 1s ease 0s infinite alternate;
	@keyframes arrowAni {
	    0%   {background-position: 0% 0%;}
	    100% {background-position: 100% 100%;}
	}