/* @override http://vacationbythesea.com/style.css */

/********************************************
 Stylesheet © Jared Loman Creative 2009
********************************************/

/******************************************************
 CSS Reset - Sets Browser Defaults to Defined values. 
******************************************************/
*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td { margin:0; padding:0 }
table { border-collapse:collapse; border-spacing:0 }
fieldset, img { border:0 }
address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal }
ol, ul, li { list-style:none }
caption, th { text-align:left }
h1, h2, h3, h4, h5, h6 { font-size:100%; font-weight:normal }
q:before, q:after { content:''}

/* Global reset-RESET */
/* The below restores some sensible defaults */
strong { font-weight: bold }
em { font-style: italic }
a img { border:none } /* Gets rid of IE's blue borders */

/* Background */
body {background: #cfe2f6 url(images/body-bg.jpg) repeat-x;}

/* Links */

a, a:link, a:visited {color: #46516b; text-decoration: none;}

a:hover {border-bottom: 1px dotted #9c9c9c;}

/******************************************************
 Site Layout - Structural Element Positioning
******************************************************/

#page-wrap {width: 960px; margin: 0 auto; position: relative;}

#top {width: 960px; height: 160px; position: relative; top: 10px; float: left; z-index: 4;}

h1#logomain {width: 200px; height: 131px; float: left; margin: 5px;}

h2#resmain {width: 200px; height: 70px; position: absolute; right: 0; top: 15px;}

h3#twitter {width: 20px; height: 20px; position: absolute; right: 47px; top: 90px;}

h4#facebook {width: 20px; height: 20px; position: absolute; right: 25px; top: 90px;}

h5#rss {width: 20px; height: 20px; position: absolute; right: 3px; top: 90px;}

ul.dropdown {margin-top: 120px; z-index: 1;}

#midcontainer {width: 960px; min-height:375px; height:auto !important; height:375px; position: relative; float: left;}

#midcontainer2 {width: 960px; min-height:375px; height:auto !important; height:375px; position: relative; float: left;}

#midrotator {width: 960px; height:375px; position: absolute; z-index: 0;}

#footer {float: left; clear: left; width: 960px;}

#footer ul {width: 960px; margin-top: 25px; text-align: center;}

/******************************************************
 Site Content - Design 
******************************************************/

h1#logomain {background: url(images/logos/logo-main.jpg) no-repeat; text-indent: -9999px;}

h1#logomain a {display: block; width: 200px; height: 131px;}

h1#logomain a:hover {border: none;}

h2#resmain {background: url(images/restop.png) no-repeat; text-indent: -9999px;}

h2#resmain a {display: block; width:200px; height: 70px;}

h3#twitter {background: url(images/logos/twitter20x20.jpg) no-repeat; text-indent: -9999px;}

h3#twitter a {display: block; width:20px; height: 20px;}

h4#facebook {background: url(images/logos/facebook20x20.jpg) no-repeat; text-indent: -9999px;}

h4#facebook a {display: block; width:20px; height: 20px;}

h5#rss {background: url(images/logos/rss20x20.jpg) no-repeat; text-indent: -9999px;}

h5#rss a {display: block; width:20px; height: 20px;}

#midcontainer {border-top: 1px solid #e7e7e7; border-bottom: 1px solid #e7e7e7; position: relative; z-index: 0;}

#midrotater {border-top: 1px solid #e7e7e7; border-bottom: 1px solid #e7e7e7; position: relative; z-index: 1;}

#footer p {margin-top: 20px; text-align: center; font-size: .75em;}
/******************************************************
 Navigation - Styling for navigation menus 
******************************************************/

/* 
	LEVEL ONE
*/
ul.dropdown                         { position: relative; z-index: 29; }
ul.dropdown li                      { float: left; zoom: 1; background: transparent; }
ul.dropdown a:hover		            { color: #000; }
ul.dropdown a:active                { color: #ffa500; }
ul.dropdown li a                    { display: block; padding: 4px 8px; color: #112960; font-family: Georgia, "Times New Roman", Times, serif; border-right: 1px solid #e6e6e6;}
ul.dropdown li:last-child a         { border-right: none; } /* Doesn't work in IE */
ul.dropdown li.hover,
ul.dropdown li:hover                { background: #fff; color: black; position: relative; }
ul.dropdown li.hover a              { color: black; }


/* 
	LEVEL TWO
*/
ul.dropdown ul 						{ width: 220px; visibility: hidden; position: absolute; top: 100%; left: 0; z-index: 30;}
ul.dropdown ul li 					{ font-weight: normal; background: #f6f6f6; color: #000; 
									   float: none; }
									  
                                    /* IE 6 & 7 Needs Inline Block */
ul.dropdown ul li a					{ border-right: none; width: 100%; display: inline-block; } 

/* 
	LEVEL THREE
*/
ul.dropdown ul ul 					{ left: 100%; top: 0; }
ul.dropdown li:hover > ul 			{ visibility: visible; }


#footer ul li {display: inline; padding: 0 15px; border-right: 1px solid #c3c3c3;}

/******************************************************
 Property - Styling for Property Page 
******************************************************/

#bdleft {float: left; width: 575px;}

#bdleft p {width: 540px;}

#bdleft h2 {font-weight: normal;}

#bdright {float: left; width: 345px; padding: 10px 15px; background: transparent url(images/bdright.jpg) repeat-x; border-left: 1px dotted #bdcfe6;}

#bdright ul {margin: 5px;}

#bdright ul li {line-height: 1.5em; list-style-image: url(images/bullet.gif);}

#bdright p {line-height: 2em; color: #2e4856;}

#bdright p span {font-weight: bold; color: #1b315f;}

#bdright h4 {margin-top: 10px;}

/******************************************************
 Specials Etc - Styling for Other Pages 
******************************************************/

#spleft {float: left; width: 575px;}

#spright {
	float: left; 
	width: 345px;
	height: 700px; 
	padding: 10px 15px;
    background-image: url(images/specev.jpg);
	border-left: 1px dotted #bdcfe6;}

#spleft2 {float: left; width: 430px;}

#spright2 {
	float: left; 
	width: 400px;
	height: 605px; 
	padding: 10px 15px;
    background-image: url(images/ghhfade.jpg);
	border-left: 1px dotted #bdcfe6;}

#spright2 div {margin-top: 15px;}

#spright2 p {line-height: 2.5em; color: #2e4856;}

#spright2 p span {font-weight: bold; color: #1b315f;}


/**#spleft2 {float: left; width: 430px;}

#spright2 {
	float: left; 
	width: 400px;
	height: 700px; 
	padding: 10px 15px;
    background-image: url(images/specev.jpg);
	border-left: 1px dotted #bdcfe6;}

#spright2 div {margin-top: 15px;}

#spright2 p {line-height: 2.5em; color: #2e4856;}

#spright2 p span {font-weight: bold; color: #1b315f;}**/

#spright div {margin-top: 60px;}

#spright p {line-height: 2.5em; color: #2e4856;}

#spright p span {font-weight: bold; color: #1b315f;}

.spmarg img {float: left; padding: 5px 10px 5px 0;}

div.imgfade {float: left;}

.map {float: left; width: 425px; margin-bottom: 20px;}

/******************************************************
New Index Styles - Jarl
******************************************************/

#inleft {float: left; margin-top: 30px; margin-bottom: 30px; width: 250px;}

#inright {float: left; display: block; width: 700px; margin-top: 30px; margin-bottom: 50px; line-height: 1.5em;}

#inright p.road {padding: 15px 0px;}

#inright p span {font-weight: bold; color: #0066FF;}

/******************************************************
 Typography - Styling for Textual Elements 
******************************************************/

body {color: #112960; font: 12px "Helvetic Neue", sans-serif;}

ul#nav {font-family: Georgia, "Times New Roman", Times, serif;}

#footer ul a {color: #909594;font: 11px Georgia, "Times New Roman", Times, serif;}

h1,h2,h3,h4,h5,h6,h7,h8 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: bold;
}

h1 {font-size: 32px;}

h2 {font-size: 24px;}

h3 {font-size: 18px;}

h4 {font-size: 16px;}

h5 {font-size: 14px;}

h6 {font-size: 12px;}

h7 {font-size: 10px;}

h8 {font-size: 48px;}

#midcontainer h2 {margin-top: 10px;}

#midcontainer p {width: 540px;}

#midcontainer2 h2 {margin-top: 10px;}

#midcontainer2 p {width: 940px; padding: 10px 10px 10px 0px;}

#midcontainer3 p {width: 400px;}

#spleft h6 span {display: block; float: left; width: 200px;}

#spleft p.spec {width: 400px; margin-bottom: 20px; color: #183841;}

#spright p {line-height: 1.5em; width: 340px;}

#bdright p {width: 350px;}

p.subt {font: italic 12px Georgia, "Times New Roman", Times, serif;}

span.caption {text-indent: -9999px; display: none; font-size: 1px;}

.spmarg {padding: 10px 0;}


/******************************************************
 Property Map - Styling for Property Image Map 
******************************************************/

#pmap {
	width: 960px;      
	height: 585px;     
	position: relative;
	overflow: hidden;
	float: left;    
	background-image: url(images/codo.jpg);      
	background-repeat: no-repeat;
}

#pmap ul {margin: 0; padding: 0; list-style: none;} 

#pmap div {
	background: rgba(255,255,255,0.65);
	padding: 0;
	float: left;
	position: relative;
}

#pmap .box1 {position: absolute; left: 550px; top: 15px;}

#pmap .box2 {position: absolute; left: 395px; top: 5px;}

#pmap .box3 {position: absolute; left: 335px; top: 135px;}

#pmap .box4 {position: absolute; left: 440px; top: 200px;}

#pmap .box5 {position: absolute; left: 550px; top: 225px;}

#pmap .box6 {position: absolute; left: 655px; top: 60px;}

#pmap .box7 {position: absolute; left: 775px; top: 90px;}

#pmap .box8 {position: absolute; left: 775px; top: 280px;}

#pmap .box9 {position: absolute; left: 583px; top: 320px;}

#pmap .box10 {position: absolute; left: 375px; top: 375px;}

#pmap .box12 {position: absolute; left: 85px; top: 425px;}

#pmap .box13 {position: absolute; left: 95px; top: 110px;}

#pmap .box14 {position: absolute; left: 250px; top: 300px;}

#pmap .box15 {position: absolute; left: 787px; top: 450px;}

#pmap .box16 {position: absolute; left: 787px; top: 475px;}

#pmap ul {float: left; margin: 5px;}

#pmap ul li.pet {background: url(images/paw.jpg) no-repeat;}

#pmap ul li.wifi {background: url(images/wifi.jpg) no-repeat;}

#pmap ul li a {display: block; margin: 5px 15px;}

#pmap ul li a:link, #pmap ul li a:visited {font-weight: normal;}

#pmap ul li a:hover {font-weight: bold; border-bottom: none;}

#pmap h4 {text-align: center; text-decoration: underline;} 


/******************************************************
 Building Map - Styling for Building Room Selection 
******************************************************/

.ppttitle ul {
	float: left;
	width: 50px;
	font-weight: bold;
	color: #315265;
	margin: 10px 0;
}

.pptlinks ul {float: left; margin-top: 10px; height: 60px;}

.pptlinks ul a {
	display: block;
	padding: 0 5px;
	background: #fff;
}

.pptlinks ul a:link, .pptlinks ul a:visited {
	font-weight: bold;
	color: #78849d;
}

.pptlinks ul a:hover {
	background: #3f5589;
	padding: 0 5px;
	color: #fff;
}

.pp2 {margin-left: 60px;}

.pp3 {margin-left: 50px;}

.pp4 {margin-left: 75px;}

.pp5 {margin-left: 75px;}

.pp6 {margin-left: 65px;}

.pp7 {margin-left: 65px;}

.pp8 {margin-left: 60px;}

.pp9 {margin-left: 65px;}
/******************************************************
 Building Gallery - Styling for Image Gallery 
******************************************************/
.caption{font-style:italic;color:#887;}
.demo{position:relative;margin-top:2em;}
.galleria_wrapper {background: transparent;}
.gallery_demo{width:540px;}
.gallery_demo li{width:68px;height:50px;border: 3px double #ddd;margin: 0 2px;background:#fff;}
.gallery_demo li div{float: left;left:240px}

.gallery_demo.galleria li {float: left;}

.galleria_container span.caption{color: #fff; text-indent: -9999px;}
	
#main_image{height:339px;width:450px;background:transparent;}
#main_image span.caption {display: none;}
#main_image img{margin-bottom:10px;}
	
.nav{padding-top:15px;clear:both;font:80% 'helvetica neue',sans-serif;letter-spacing:3px;text-transform:uppercase;}
	
.info{text-align:left;width:450px;margin:30px auto;border-top:1px dotted #221;padding-top:30px;}
.info p{margin-top:1.6em;}

/******************************************************
 Contact Form - Styling for contact.php 
******************************************************/
fieldset { border:0;margin:0;padding:0; }
label { display:block; }
input.text,textarea { width:300px;font:12px/12px 'courier new',courier,monospace;color:#333;padding:3px;margin:1px 0;border:1px solid #ccc; }
input.submit { padding:2px 5px;font:bold 12px/12px verdana,arial,sans-serif; }

ul#footnav li.nobdr {border: none;}

ul.dropdown li.nobdr {border: none;}