/*

[ CSS Document ]

	Style Sheet Name: style.css
	Website: Sydney Airport Hotels
	Author: Jimmyweb Web Design
	Author URL: www.jimmyweb.net
	Version: 1.0
	Date: 25/11/09
    Updated: 03/03/2010

[ Table Of Contents ]

	0- Reset
	1- Global
	2- Headings
	3- Header
	4- Navigation
	5- Main Content Elements
	6- Main Content
	7- Extras
	8- Forms
	9- Footer
*/ 

/* Variables (See ColorTile.gif in CSS folder) 
@variables {
    Darkest: #190C07;
    Darker: #271710;
    Dark: #22211B;
    Medium: #3B312E;
    Light: #3F2D26;
    Lighter: #444412F;
    BackGround: #666256;
    Accent1: #8D8D8D;
    Accent2: #E1E1E1;
    Accent3: #F5F6F6;
    Accent4: #E6DFD0;
    Accent5: #D3CCBD;
    Font1: #787469;
    Font2: #B7AC94;
}
*/

/* =0 Reset –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
    
	/* Universal - reset browser default styles */
		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, font, 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 
				{ margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;}
		body 	{ line-height: 1; }
		ol, ul 	{ list-style: none; }
		blockquote, q { quotes: none; font-style:italic;}
		hr { color:#666256;background-color:#666256; height:2px; border:0; }
		
	/* Define focus styles! */
		:focus 	{ outline: 0; }
		
	/* Highlight inserts somehow! */
		ins 	{ text-decoration: none; }
		del 	{ text-decoration: line-through; }
		
	/* Tables still need 'cellspacing="0"' in the markup */
		table 	{ border-collapse: collapse; border-spacing: 0; }


/* =1 Global –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
	
	/* General style applied to HTML */
		html 	{ text-align: left; padding: 0; margin: 0; border: 0; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; width: 100%; }
	/*	
		background: #fff url(../images/bg-main.jpg) top center repeat;
		background: url(../images/bg-top.jpg) top center repeat-x;
	*/
	
	/* Body style */
		body 	{ clear: both; line-height: 1; vertical-align: top; background: #d8d6ce; color: #000;
			padding: 0; margin: 0 auto; text-align: left; }		
		
	/* Preset global styles */
		.right 			{ float: right; } 
		.left 			{ float: left; } 
		.align-left 	{ text-align: left; } 
		.align-right 	{ text-align: right; } 
		.align-center 	{ text-align:center; } 
		.justify 		{ text-align:justify; } 
		
		.hide 			{ display: none; } 
		.clear 			{ clear: both; } 
		.bold 			{ font-weight:bold; } 
		.italic 		{ font-style:italic; } 
		 
		img.centered 	{ display: block; margin-left: auto; margin-right: auto; } 
		img.alignleft 	{ float: left;  margin: 4px 10px 4px 0px; } 
		img.alignright 	{ float: right; margin: 4px 0px 4px 10px; } 
		
		.spacer 		{ display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } 


/* =2 Headings –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/  

	/* General headings */
		h1 		{ font-size: 1.7em; color: #000; margin: 0px; padding: 25px 0 0 30px; font-weight: 500;}
		h2, h3, h4, h5, h6, h8 { color: #e6dfd0; font-weight: 500; }
			h2 	{ font-size: 1.0em; margin: 10px 0 10px 0px; }
			h3 	{ font-size: 1.1em; margin: 0 0 0.5em 0; }
			h4 	{ font-size: 0.9em; margin: 0 0 0.5em 0; }
			h5 	{ font-size: 0.8em; margin: 0 0 0.5em 0; }
			h6 	{ font-size: 0.7em; margin: 0 0 0.5em 0; }
			h8 	{ font-size: 0.9em; margin: -10px 0 0 0; font-weight: 600;}


/* =3 Header –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/ 

	/* Header section style */
		#header { 
		background: url(../images/bg-top.jpg) top center no-repeat;
		height: 412px;
		position: relative;
		}
		#headerrates { 
		background: url(../images/bg-toprates.jpg) top center no-repeat;
		height: 412px;
		position: relative;
		}
		#headerratesnosearch { 
		background: url(../images/bg-toprates2.jpg) top center no-repeat;
		height: 412px;
		position: relative;
		}
		

/* =4 Navigation –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/ 

	/* Main Navigation - Horizontal style */
		#mainNav { 
		background-color: #190c07;	
		border-bottom: 1px solid #fff;
		margin:  		0px 0px 0px 0px;
		padding: 		0px 0px 0px 0px; 
		width:   		975px; 
		height: 			30px;
		}
		#mainNav li { 
		display: 		inline; 
		float: 			left; 
		font-size: 		0.7em; 
		margin: 			0px 0px 0px 0px;
		}
		#mainNav li a {
		border-right: 1px solid #8d8d8d;
		display: 		block;
		padding: 		8px 15px 0px 15px; 
		height: 			22px;
		}
		#mainNav li a:link, #mainNav li a:visited { 
		text-decoration: none;
		color:			#d3ccbd;	
		}
		#mainNav li a:hover { 
		background-color: #3b312e;
		color:			#fff;
		text-decoration: none;
		}
		/* Active element */
		#mainNav li.active a:link, 
		#mainNav li.active a:visited, 
		#mainNav li.active a:hover { 
		color:			#fff;
		text-decoration: none;
		}
		

/* =5 Main Content Elements –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/ 

	/* General paragraph style */
		p { 
		color: 		#B7AC94;
		background-color: transparent;
		font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
		font-size: 	12px;
		line-height: 1.2em;  
		margin: 	0px 0px 0px 0px;
		padding: 	0em 0px 1.3em 0px; 
		}
		
		blockquote { 
		font-style:	italic; 
		quotes: 	none;
		}			
			
	/* General list styles  */
		#content ul { 
		list-style-type: disc; 
		}
		#content ol { 
		list-style-type: decimal; 
		}
		#content ul, #content ol { 
		color: 		#B7AC94;
		font-family: Helvetica,Geneva,Arial,SunSans-Regular,sans-serif;
		font-size: 	0.8em;
		line-height: 1.3em;  
		margin: 	0px 0px 0px 20px;
		padding: 	0em 0px 1.5em 0px; 
		}	
			
	/* General link styles  */
		#content a:link, #content a:visited { 
		color:		#e6dfd0; 
		text-decoration: none;
		}
		#content a:hover { 
		color:		#fff; 
		text-decoration: none; 
		}
		


	
		
/* =6 Main Content –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/ 
		
	/* Content wrapper */
		#contentWrapper { 
		background: #190c07 url(../images/bg.jpg) top center repeat-y;
		clear: 		both;
		margin: 		0px auto 0px; 
		padding: 	0px 5px 0px 5px;		
		text-align: left; 
		width: 		975px; 
		}
	/* Rates wrapper */
		#ratesWrapper { 
		background: #190c07 url(../images/bgrates.jpg) top center repeat-y;
		clear: 		both;
		margin: 		0px auto 0px; 
		padding: 	0px 5px 0px 5px;		
		text-align: left; 
		width: 		975px; 
		}
	/* Content */
		#content {
		float: 		left;  
		margin:  	0px 0px 0px 0px;	
		padding: 	0px 0px 0px 0px;
		width: 		975px;
		}
	
	/* Rates Content Wrap --------------------- */	
	    #ratesContentWrap {	
		float: 		left; 
		margin:  	0px 0px 0px 20px;
		padding: 	0px 0px 0px 0px;
		width: 		930px;
		} 
		.ratesWrap {
		float: left;
		width: 745px;
		padding: 10px 0 0 10px;
		margin-bottom: 20px;
		position: relative;
		}
		
		.ratesWrapText {
		float: right;
		width: 480px
		}
		.ratesWrapText .moreLink {
		display: block;
		}
		.ratesWrapText a{
		float: right;
		}		
	
	
	/* Main Content Wrap --------------------- */
		#mainContentWrap {	
		float: 		left; 
		margin:  	0px 0px 0px 20px;
		padding: 	0px 0px 0px 0px;
		width: 		630px;
		background-color: #190c07;
		}

		.hotelWrap {
		float: left;
		width: 600px;
		background: #271710 url(../images/grad1.jpg) top left no-repeat;
		padding: 10px 20px 0 10px;
		margin-bottom: 20px;
		border-bottom: 1px solid #000;
		border-right: 1px solid #000;
		border-top: 1px solid #3f2d26;
		border-left: 1px solid #3f2d26;
		position: relative;
		cursor: pointer;
	    cursor: hand; /*IE Hack*/
		}
		.hotelWrap img {
	    	border: 4px solid #271710;    	
    		background-color: #271710;
    		display:block;
		float: left;
		}
		.hotelWrap .icons {
		position: absolute;
		top: 3px;
		right: 0;
		}
		.hotelWrap .icons img{
		margin-right: 3px;
		border: none;
		}
		.hotelWrap h3{
		text-align:left;
		}
		.hotelMain {
		float: left;
		width: 600px;
		padding: 10px 20px 0 10px;
		margin-bottom: 20px;
		position: relative;
		}
		.hotelMain h3{
		text-align:left;
		}
		
		.hotelWrapText {
		float: right;
		width: 480px;
		}
		.hotelWrapText .moreLink {
		display: block;
		}
		.hotelWrapText a{
		float: right;
		}
		
	/* Hotel Map Wrap --------------------- */		
	    .hotelMap {
		float: left;
		width: 360px;
		background: #271710 url(../images/grad1.jpg) top left no-repeat;
		padding: 10px;
		border-bottom: 1px solid #000;
		border-right: 1px solid #000;
		border-top: 1px solid #3f2d26;
		border-left: 1px solid #3f2d26;
		position: relative;
		}
	.hotelMap img {
	    	border: 4px solid #271710;
    		background-color: #271710;
    		display:block;
    		margin-right: 10px;
		float: left;
		}
	.hotelMap h8 
		{
	    	color:#fff;
	    	background-color:Transparent;
		margin-top: -10px;
		float:left;
		}
	.hotelMap p {
		float:left;
		}	
						
	/* Side Content Wrap --------------------- */
	    #sideRates {
		float: 		right;
		margin:  	-30px 0px 0px 0px;
		padding: 	0px 0px 0px 0px;
		width: 		172px; 
		text-align: right;
		position: relative;
		}		
		#sideContent {
		float: 		right;
		margin:  	-30px 0px 0px 0px;
		padding: 	0px 0px 0px 0px;
		width: 		300px; 
		} 
		#sideContent #sideText {
		padding: 0 0 10px 0;
		background-color: #44412f;
		}
		#sideContent #sideText h4 {
		background-color: #54513d;
		padding: 15px 20px 15px;
		border-top: 1px solid #22211b;
		}
		#sideContent #sideText p {
		padding: 10px 20px 10px;
		}
		#sideContent #sideText ul {
		padding: 1px 20px 1px 25px;
		}
		
		#sideMap {
		padding: 0; 
		margin: 0;
		}
		#sideMap p {
		padding: 0; 
		margin: 0;
		}
		#sideMap h4{
		padding: 5px 20px 5px;
		}
		
		a#mapLink {
		width: 300px;
		height: 163px;
		display: block;
		padding: 0; 
		margin: 0;
		}
		a#mapLink:link, a#mapLink:visited {
		background: url(../images/map1.jpg) top left no-repeat;
		}
		a#mapLink:hover {
		background: url(../images/map1.jpg) bottom left no-repeat;
		}
		
		#cityMap {
		padding: 0; 
		margin: 0;
		}
		#cityMap p {
		padding: 0; 
		margin: 0;
		}
		#cityMap h4{
		padding: 5px 20px 5px;
		}
		
		a#cityLink {
		width: 300px;
		height: 163px;
		display: block;
		padding: 0; 
		margin: 0;
		}
		a#cityLink:link, a#cityLink:visited {
		background: url(../images/map3.jpg) top left no-repeat;
		}
		a#cityLink:hover {
		background: url(../images/map3.jpg) bottom left no-repeat;
		}
		
/* =7 Extras –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/ 

	/* Image styles  */
		
	/* Fader style - used for jQuery Innerfade  */
	#fader {
		margin-top: 43px;
		z-index: 0;
		}

    	/* Image popups  */
	#sideImages
        {
        width:152px;
    	display:block;
		float: right;
        }	
    	#sideImages img
        {
	    border: 3px solid #271710;
    	border-right: 3px;
    	margin: 10px 0 10px 0;
    	background-color: #271710;
    	display:block;
		float: left;
        }
	.slide
        {
        width:152px;
        display:block;
        border: 4px solid #271710;
        }	
        .images
        {
            float:right;
        }
        .viewer
        {
            display:none;
            vertical-align:top;
        }
        .viewer img
        {
            border: 4px solid #271710;
            float:left;
        }
        .view
        {
            position:fixed;
            display:block;
            visibility:visible;
            top: 20%;
            left: 35%;
        }
        .thumbnail
        {
            width:150px;
        }
        .features 
        {
		    font-size: 	12px;
		    margin: 	0px 0px 20px 0px;
        }
        .features td
        {
            border: solid 1px #B7AC94;
		    padding: 	1em; 
		    width: 33%;
        }
        .images
        {
            display:block;
            border:none;
        }

/* =8 Forms –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/ 

	/* Form elements  */
	
	#formWrap {
	position: absolute;
	top: 88px;
	right: 0;
	z-index: 0;
	width: 256px;
	}
	#formWrap p { 
	margin: 0;
	padding: 0; 
	}
	#formWrap p label { 
	margin: 0;
	padding: 0;
	font-size: 1.5em; color: #000; 
	}
	#formWrap p input {
	margin: 9px 0 23px;
	width: 200px;
	border: none;
	}
	#formWrap p input#txtArrival {
	background: url(../images/calendar.jpg) center right no-repeat;
	width: 204px;
	}
	#formWrap p select {
	margin: 9px 0 23px;
	width: 206px;
	border: none;
	}
	#formWrap input#submit 
	{
	margin-left: 65px;
	width: 150px;
	z-index:0;
	}
	.left

	/* =9 Footer –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/  

	/* Footer Wrapper  */
		#footerWrap {
		clear: 		both; 
		width: 		100%; 
		text-align: center;
		}
	/* Footer */
		#footer {
		background-color: #000;	
		border-top: 1px solid #8d8d8d;
		clear:		both; 
		width: 		935px; 
		margin: 	0px auto;
		text-align: left; 
		padding: 20px 20px 10px;
		}
		#footer p { 
		color:		#B7AC94; 
		font-size: 	0.7em; 
		line-height: 1.5em;
		}
		#footer p a:link, #footer p a:visited { 
		color:		#d3ccbd; 
		text-decoration: none;
		}
		#footer p a:hover { 
		color:		#fff; 
		text-decoration: none; 
		}