* {
	box-sizing: border-box;
}

html {
	background-color: #fff;
	height: 100%;
	margin: 0;
	min-height: 100%;
	overflow: hidden;
	padding: 0;
	font: normal 16px/21px Verdana, Helvetica, sans-serif;
	background-repeat: no-repeat;
	background-position: center;
	background-attachment: fixed;
	-webkit-background-size: cover;
	background-size: cover !important;
}

@media only screen and (max-device-width: 767px) and (orientation: portrait) {
	html {background-image: url(Victoria-Harbour-vertical-375.jpg);}
}
	
@media only screen and (min-device-width: 768px) and (orientation: portrait) {
	html {background-image: url(Victoria-Harbour-vertical-768.jpg);}
}
	
@media only screen and (max-device-width: 1023px) and (orientation: landscape) {
	html {background-image: url(Victoria-Harbour-667.jpg);}
}
	
@media only screen and (min-device-width: 1024px) and (max-device-width: 1365px) and (orientation: landscape) {
	html {background-image: url(Victoria-Harbour-1024.jpg);}
}
	
@media only screen and (min-device-width: 1366px) and (max-device-width: 1919px) and (orientation: landscape) {
	html {background-image: url(Victoria-Harbour-1366.jpg);}
}
	
@media only screen and (min-device-width: 1920px) and (orientation: landscape) {
	html {background-image: url(Victoria-Harbour-1920.jpg);}
}

body {
	height: 100%;
	margin: 0;
	min-height: 100%;
	overflow: auto;
	padding: 0;
	text-align: center;
}

img {
	border: none;
	margin: 0;
	padding: 0;
	vertical-align: 0;
}

#navBox {
	width: 100%;
	height: 100px;
	margin: 0;
	padding: 0;
	vertical-align: 0;
	background: #000;
	position: fixed;
	text-align: center;
	box-shadow: 0 3px 8px 0 #fff;
	z-index: 10;
}

#navArea {
	width: 300px;
	margin: 0 auto;
	padding: 10px 0 0 0;
	vertical-align: 0;
	position: relative;
	text-align: center;
}

#navArea img {
	width: 95%;
}

#menuTab {
	width: 200px;
	height: 35px;
	margin: 0 auto;
	padding: 5px;
	vertical-align: 0;
	background: #000;
	color: #fff;
	position: fixed;
	text-align: center;
	border: none;
	border-radius: 0 0 15px 15px;
	box-shadow: 0 3px 8px 0 #fff;
	top: 100px;
	left: calc(50% - 100px);
	z-index: 11;
}


#blank140 {
	width: 100%;
	height: 140px;
	margin: 0;
	padding: 0;
	vertical-align: 0;
}

#wrapper {
	border: none;
	width: 100%;
	max-width: 1280px;
	height: auto;
	min-height: 100%;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	position: relative;
	vertical-align: 0;
}

#content {
	width: 93.75%;
	height: auto;
	margin: 0 auto;
	padding: 0;
	position: relative;
	text-align: center;
}

.centerDiv, .centerDivWh, .centerDivWhSm, .contentDiv, .contentDivWh {
	height: auto;
	padding: 10px;
	position: relative;
	text-align: center;
	border: 2px solid #000;
	border-radius: 10px;
}

.centerDiv, .contentDiv {
	background-color: rgba(0,0,0,0.5);
	margin: 0 auto;
	width: 280px;
}

.contentDiv {
	width: 100%;
}

.contentDivWh, .centerDivWh, .centerDivWhSm {
	background-color: rgba(255,255,255,0.8);
	margin: 10px auto;
}

.contentDivWh, .centerDivWh {
	width: 100%;
}

.centerDivWhSm {
	width: 280px;
}

.ctrWhL, .ctrWhR {
	width: 260px;
	padding: 0;
	position: relative;
}

.ctrWhL {
	margin: 0 auto;
}

.ctrWhR {
	margin: 15px auto;
}

p, div, .reg, ul li {
	font-size: 1.1rem;
}

ul {
	padding-left: 1.2rem;
}

.ctrWhL p {
	font-size: 1.1rem;
}

.ctrWhR p {
	font-size: 0.8rem;
}

.centerDiv p, .contentDiv p {
	color: #fff;
}

.centerDivWh p, contentDivWh p, .centerDivWhSm p {
	color: #000;
}

h1 {
	color: #963; 
	font-size: 1.7rem;
	font-weight: 600;
	line-height: 1.8rem;
	margin: 0;
	text-align: center;
}

h2 {
	color: #963; 
	font-size: 1.2rem;
	font-weight: 600;
	line-height: 1.4rem;
	margin: 10px 0 0 0;
	text-align: left;
}

a, a:visited {
	color: #0099e4;
	text-decoration: underline;
}

a:hover { 
	text-decoration: none;
}

a.nav, a.nav:visited {
	font-weight: 600;
	text-decoration: none;
}

a:hover {
	color: #fff;
}

textarea, input[type="text"], input[type="button"] {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

input[type="text"] {
	border: 2px solid #000;
	border-radius: 5px;
	caret-color: #c00;
	color: #666;
	display: inline-block;
	font-size: 1.3rem;
	font-weight: 500;
	margin: 10px 0 0 0;
	padding: 5px;
	text-align: center;
	width: 250px;
}

input[type="text"].codeField {
    font: 600 2.5rem "Courier New",Courier,"Lucida Sans Typewriter","Lucida Typewriter",monospace;
	margin: 0;
	width: 250px;
}

textarea {
	border: 2px solid #000;
	border-radius: 5px;
	color: #666;
	display: inline-block;
	font-size: 1.0rem;
	margin: 10px 0 0 0;
	padding: 5px;
	width: 250px;
	height: 75px;
}

input[type="text"]:focus, textarea:focus {
	outline: none;
	border: 2px solid #963 !important;
	border-radius: 5px;
	color: #000;
}

input[type="text"].codeField:focus {
	color: #c00;
}

select {
	font-size: 1.0rem;
	margin: 10px 0 0 0;
}

input[type="checkbox"], input[type="radio"] {
	border: 2px solid #963;
	display: inline-block;
	transform: scale(1.5,1.5);
	-webkit-transform: scale(1.5,1.5);
	-moz-transform: scale(1.5,1.5);
	-o-transform: scale(1.5,1.5);
}

input[type="submit"], input[type="submit"]:visited, .accordion, .accordion:visited, a.btn, a.btn:visited {
	background: #0099e4;
	border: none;
	border-radius: 8px;
	color: #fff;
	display: inline-block;
	font-size: 1.2rem;
	line-height: 1.5rem;
	margin: 0;
	padding: 2px 8px;
	text-decoration: none;
}

.accordion, .accordion:visited {
	font-size: 1.5rem;
	line-height: 1.8rem;
}

input[type="submit"]:hover, .accordion:hover, a.btn:hover {
	background: #963;
}

.txtbtn, .txtbtn:visited {
	background: none;
	border: none;
	color: #0099e4;
	display: inline-block;
	font-size: 1.1rem;
	line-height: 1.3rem;
	margin: 0;
	padding: 0;
	text-decoration: underline;
}

.txtbtn:hover {
	text-decoration: none;
}

.panel {
	background: none;
	display: none;	
	margin: 0 auto;
	overflow: hidden;
	padding: 0 18px;
	text-align: left;
	width: 100%;
	max-width: 600px;
}

.lg {
	font-size: 1.2rem;
}

.lgr {
	font-size: 1.3rem;
	margin: 0;
	padding: 0;
	vertical-align: 0;
}

.lgStr {
	font-size: 1.2rem;
	font-weight: 600;
}

.sm {
	font-size: 0.9rem;
}

.sml {
	font-size: 0.8rem;
}

.smllr {
	font-size: 0.7rem;
	line-height: 0.9rem;
	margin: 0 0 8px 0;
}

.str {
	font-weight: 600;
}

.clr {
	clear: both;
}

.ctr {
	text-align: center;
}

.noMar {
	margin: 0;
	padding: 0;
	vertical-align: 0;
}

.noMarSm {
	font-size: 0.9rem;
	margin: 0;
	padding: 0;
	vertical-align: 0;
}

.smMar {
	margin: 10px 0;
	padding: 0;
	vertical-align: 0;
}

.tall {
	line-height: 1.8rem;
}

.brn {
	color: #963;
	font-weight: 600;
}

.lft {
	text-align: left;
}

.ib {
	display: inline-block;
}

.ibBrnB {
	color: #963;
	display: inline-block;
	font-weight: 600;
}
	

hr {
	width: 100%;
	height: 1px;
	margin: 10px 0px;
	border: 0;
	color: #9999b4;
	background-color: #9999b4;
}

@media only screen and (min-width: 400px) {
	
	#navArea img {
		width: 100%;
	}
	
}

@media only screen and (min-width: 600px) {
	
	.ctrWhR {
		width: calc(100% - 300px);
		text-align: left;
		margin: 0 auto;
	}
	
	.ctrWhR p {
		font-size: 0.9rem;
	}
	
}

@media only screen and (min-width: 1024px) {
	
	#navBox {
		padding: 0 14px 0 0;
	}
	
	#menuTab {
		left: calc(50% - 107px);
	}
	
}