/* #####   Page main styles    ##### */
html {
	background: #369 url(../images/bg/background-2.jpg) center top no-repeat;
	height: 100%;
	width: 100%;
}

body {
    font: 15px Arial,non-serif;
 	margin: 0;
    padding: 0;
}

h1 {
	font: bold 1.9em Times New Roman,serif;
	/* color: #993300; */
 	margin: 12px 16px;
    padding: 0;
}

h2 {
	font: bold 1.6em Times New Roman,serif;
/* 	color: #993300; */
 	margin: 9px 13px;
    padding: 0;
	white-space: nowrap;
}

h3 {
	font: bold 1.3em Times New Roman,serif;
/* 	color: #993300; */ 
	margin: 6px 11px;
    padding: 0;
}

h4 {
	font: bold 1.1em Arial,non-serif;
/* 	color: #993300; */ 
	margin: 3px 5px;
    padding: 0;
}

h5 {
	font: bold .9em Arial,non-serif;
 	margin: 2px 3px;
    padding: 0;
}

hr {
	margin: 2em 0;
}

p {
 	margin: 9px 0;
	line-height: 1.4em;
}

ul {
	margin: 0 10px;
	padding: 0;
}

li {
	/* list-style: none; */
}

img {
	border: 0;
}

table, tr, td {
	margin: 0;
	padding: 0;
}

td {
	/* padding: 0 5px 0 0;  */
}

	/* Link tag "a" has four stages 1) "link", 2) "active", 3) "visited" and 4) "hover" to change the format of first line  */
a:link {
	color: blue;
	text-decoration: underline;		/* or none  */
}
a:active {
	color: red;
	text-decoration: none;
}
a:visited {
	color: green;
	text-decoration: none;
}
a:hover {
	color: red;
	font-weight: bold;
	text-decoration: none;
}




/* ########   Container styling    ######## */
#container {
	position: relative;
	height: 100%;
	width: 1005px;
	margin: 0 auto;
	padding: 0;
	color: #black;
}




/* #######   Header area    ####### */
#headerArea {
	margin: 10px;
	height: 350px;
	width: 100%;
}
#headerLogo {
	position: absolute;
	top: 0px;
	left: 50px;
	z-index: 999;
}
#headerSlogan {
	position: absolute;
	top: 280px;
	right: 20px;
	z-index: 99;
}
#headerSlides {
	position: absolute;
	top: 20px;
	left: 10px;
	z-index: 9;
}




/* #######   Main  area    ####### */
#mainArea {
	width: 100%;
}


/* #####   Menu styling    ##### */
#navArea {
	width: 190px;
}

#navMenu {
	margin: 0 0 0 10px;
	z-index: 99;
}

#facebook {
	margin: 30px 0 0 29px;
	z-index: 99;
}

#itcst {
	margin: 50px 0 0 32px;
	z-index: 99;
}


/* #####   Content styling   ##### */
#contentArea {
	position: absolute;
	top: 350px;
	left: 210px;
    width: 795px;
	float: left;
}

#siteLocation {
	position: absolute;
	top: 5px;
	left: 10px;
	font-size: 0.8em;
	/*color: #993300;*/
	z-index: 99;
}
#siteLocation a:link, #siteLocation a:active, #siteLocation a:visited {
	color: #FF8080;
}
#siteLocation a:hover {
	font-weight: bold;
}

#homePageContent {
	padding: 10px;
}
#homeDescription {
	margin: 20px;
}
#homeContent {
	margin: 10px;
}
#homeContent ul {
	margin: 0 0 0 30px;
	padding: 0;
}
#homeContent li {
	margin: 0;
	padding: 0 0 4px 0;
}

.featured {
	text-decoration: underline;
	margin: 0 0 6px 0;
	font: bold 1em Arial,non-serif;
	color: #06C;
}

.planned {
	font: bold 1em Arial,non-serif;
	color: #F30;
	position: absolute;
	right: 50px;
}
* html  .planned {
}

.design {
	font: bold .9em Arial,non-serif;
}

.itinerary, .header, .links, .offer {
	font: bold .9em Arial,non-serif;
	padding: 4px 6px 6px;
	text-align: center;
}
.itinerary, .links {
    -webkit-border-radius: 8px;
    border-radius: 8px;
}
.itinerary {
	background: #DBC66E;
	border: 5px outset;
	max-width: 90%;
}
.links {
	background: #E2D5A3;
	border: 3px outset;
	max-width: 100%;
}
.header {
	background: #FBEEC1;
	border: 1px outset;
	max-width: 100%;
	font: 1em Arial,non-serif;
	text-align: left;
}
.offer {
/* 	background: #FBEEC1; */
	background: rgba(251,238,193,.75);
	border: 1px outset;
	border-radius: 5px;
	display: flex;
}
.offer_text {
	font: 1em Arial,non-serif;
	text-align: left;
	width:60%;
	padding: 2%;
	float: left;
}
.offer_pic {
	width:28%;
	padding: 4%;
	float: left;
	margin: 1em 0;
}
.offer_header {
	margin: 0 auto 1em;
}

#quote {
	font: 1em Times New Roman, serif;
	color: #000080;
}

#w3c {
	text-align: right;
	margin: 50px 0 0 0;
	z-index: 99;
}

#login {
	z-index: 12;
}

#sgh {
	font: bold 1.2em Arial,non-serif;
}

.picLeft{
	float: left;
	max-width: 50%;
}
.picRight{
	float: right;
	max-width: 50%;
}
.picHorizontal{
	margin: 0 4px 0 0;
}
.picVertical{
	margin: 0 0 4px 0;
}


	/* This defines the position of a form */
#form {
	position: relative;
}


#updateForm, #contactForm, #itineraryForm, #newsletterForm {
	position: relative;
}

#contactForm {
	max-width: 70%;
	margin: 10px;
}

#itineraryForm {
	max-width: 99%;
	margin: 10px;
}

#newsletterForm {
	/* max-width: 48%; */
	margin: 10px;
}


.sitemap {
	margin: 0 10px;
}



	/* Here is the pagination style defined */
#paginate {
	position: relative;
	bottom: -6px;
	text-align: center;
	width: 100%;
	font: bold 0.7em Verdana,san-serif;
}




/* #####   Footer styling area    ##### */
#footerArea {
	clear: both;
	font: 0.7em Arial,non-serif;
	z-index: 10;
}

#footerCopyRight {
	position: absolute;
	bottom: 6px;
	left: 5px;
	color: #993300;
}
#footerNav {
	position: absolute;
	bottom: 6px;
	left: 300px;
}
#footerNav a:link, #footerNav a:active, #footerNav a:visited {
	color: #993300;
}
#footerNav a:hover {
	color: #cc00ff;
	font-weight: bold;
}
#footerNav a {
	display: inline;
	padding: 5px 20px;
}


.clear10 {
	clear: both;
	height: 1em;
}
