@charset "utf-8";
/* CSS Document */

/*** RESET ***/
* { margin: 0; padding: 0; font-family: Verdana, Geneva, sans-serif; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; }
img { border: none; }
a, a:visited { color: #000; }
a:hover { text-decoration:none; }
strong { font-weight: bold; }

/*** CLEARS AND FLOATERS ***/
.right {float: right;}
.left {float: left;}
.clear {clear: both; width: 0; height: 0;}
.clear-left {clear: left; }
.clear-right {clear: right; }
.hide {display:none; }

/*** PAGE FORMATTING ***/
body {
	background: #faeeb4;
}
#site-container {
	margin: 0 auto 20px auto;
	width: 985px;
	background: #fff;
	border-left: 3px solid #c8be90;
	border-right: 3px solid #c8be90;
	border-bottom: 3px solid #c8be90;
}
#page-container {
	margin: 0 auto;
}

/*** TIP TOP STLES ***/
#tip-top {
	height: 32px;
	background: #34a4f7;
	border-bottom: 3px solid #e4f984;
}
#pet-owners {
	float:right;
	margin: 0 0 0 10px;
	color: #333;
	height: 27px;
	padding: 3px 8px 0 8px;
	font-size: 11px;
	text-align: center;
} 
#beach-cam {
	float:right;
	margin: 0;
	background: #1a90e7;
	color: #333;
	height: 25px;
	padding: 6px 8px 0 8px;
	font-size: 11px;
	text-align: center;
}
#beach-cam img,
#pet-owners img {
	margin-bottom: -5px;
	margin-right: 2px;
}
#top-nav {
	float:right;
	margin: 0 20px 0 0;
	background: #1a90e7;
	width: 110px;
	height: 20px;
	padding: 9px 5px 0 5px;
	font-size: 11px;
	font-weight: bold;
	text-align: center;
}
#top-nav,
#top-nav a,
#beach-cam a,
#pet-owners a,
#logout a {
	font-weight: bold;
	color: #c3ed31;
	text-decoration: none;
}
#logout {
	float: left;
	font-size: 11px;
	margin: 9px 0 0 10px;
}

/*** HEADER STYLES ***/
#header h1 {
	display: none;
	text-indent: -10000px;
}
#header {
	background: #30b5fa;
	border-bottom: 5px solid #e4f984;
}
img#logo {
	margin: 0 -51px 0 0;
	float: left;
	position: absolute;
	z-index:10;
}
#header #flash-box {
	float: left;
	width: 516px;
	position: absolute;
	margin: 0 0 0 197px;
}
#header #video-box {
	float: right;
	width: 269px;
	text-align: center;
	padding: 3px 0 0 0;
	font-size: 12px;
}
#header #mast {
	margin: 0 0 0 224px;
	background: url(http://mexico-beach.com/themes/mexicobeach/images/mast.jpg) top right no-repeat;
	height: 100px;
}

/*** SEARCH ***/
#search {
	float: right;
	margin: -5px 0 10px 0;
	padding: 1px 15px 0 0;
	height: 25px;
	width: 255px;
	background: #e4f984;
}
#search form {
	margin: 2px 0 0 0;
}
#search form #submit {
	margin: 1px 6px 0 0;
}
#search form #query {
	margin: 0;
	height: 18px;
}

/*** WEATHER BUG ***/
#weatherbug {
	float: right;
	margin: 2px 0 0 0;
	color: #fff;
	padding: 0 8px;
	font-size: 11px;
	text-align: center;
} 

/*** NAVIGATION ***/
#nav {
	width: 197px;
	margin: 0;
	padding: 0;
	background: url(http://mexico-beach.com/themes/mexicobeach/images/nav-bg.gif) top;
	float:left;
	border-top: 10px solid #e4f984;
}
#nav ul li,
#nav ul li a,
#nav ul li a:hover,
#nav ul li a:visited {
	color: #222;
	text-decoration: none;
}
#nav ul li {
	text-align: right;
	padding: 0;
	list-style: none;
	font-size: 12px;
	font-weight: bold;
}
#nav ul li a {
	display: block;
	height: 25px;
	padding: 7px 22px 0 0;
	font-family: Georgia, "Times New Roman", Times, serif;
}
#nav ul li a:hover {
}
#nav ul li ul li,
#nav ul li ul li a,
#nav ul li ul li a:hover,
#nav ul li ul li a:visited {
	color: #fff;
	text-decoration: none;
}
ul#bot-nav {/* Redundant navigaion at bottom of page */
	margin: 0 6px;
	display: inline;
}
ul#bot-nav li {
	display: inline;
	list-style: none;
	font-size: 10px;
}
ul#bot-nav li,
ul#bot-nav li a {
	color: #df7242;
	text-decoration: none;
}

/*** SIGNUP BOX ***/
#signup-box {
	padding: 14px 12px;
	width: 173px;
	background: #93c8f1;
	border-bottom: solid 8px #58a4ed;
	border-top: solid 8px #58a4ed;
	font-size: 12px;
	margin:0;
}
#signup-box p {
	color: #003862;
	font-weight: bold;
	margin: 0 0 7px 0;
}
#signup-box form #email {
	width: 105px;
}
#signup-box form #email {
	font-size: 11px;
}
#signup-box form #join {
	font-size: 10px;
}


/*** UNIVERSAL CONTENT ***/
#content {
	width: 778px;
	float: right;
	clear: right;
	padding: 0 5px 10px 5px;
	color: #333;
}
#content p,
#sidebar p,
#content li {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 12px;
	margin: 5px 0 5px 0;
	color: #333;
	line-height: 16px;
}
#content li {
	margin: 5px 0 5px 30px;
}
#content ul {
	margin: 0 0 15px 0;
}
#content #Main hr,
#sidebar hr {
	color: #1a90e7;
	border-bottom: 4px solid #34a4f7;
	
}
#content #Main h2,
#sidebar h3 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 15px;
	font-weight: bold;
	color: #1e69a1;
}
#content #info-guide {
	margin: 0 0 10px 0;
}

/*** Headlines ***/
#headline {
	width: 412px;
	margin: -13px -4px 13px 16px;
}
#headline h2 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: italic;
	font-size: 26px;
	color: #f74b00;
	background:#FFF;
	border-bottom:none;
}

/*** Footer ***/
#footer {
	font-size: 10px;
	padding: 15px 6px 0 6px;
}
#footer,
#footer a {
	color: #74a2c5;
}
#footer p {
	display: inline;
}
#footer #social-bookmarks {
	float: right;
	margin: 0;
	height: 24px;
	font-weight: bold;
}
#footer #social-bookmarks img {
	margin-left: 2px;
	margin-bottom: -3px;
}

/*** 3-COLUMN LAYOUT ***/
.three-col #Main {
	width: 413px;
	float: left;
	margin: 0 15px;
}
.three-col #col-2 {
	width: 131px;
	float: left;
	clear: none;
	margin: 25px 10px 0 10px;
}
.three-col #col-3 {
	width: 171px;
	float: left;
	clear: none;
	margin: -25px 0 0 10px;
}

/*** 2-COLUMN LAYOUT ***/
.two-col #Main {
	width: 545px;
	float: left;
	margin: 0 15px;
}
.two-col #col-2 {
	width: 168px;
	float: left;
	margin: -25px 15px 0 10px;
}

/*** HOME PAGE STYLES ***/
#header #video-box p {
	margin: 5px 0 0 0;
}
#Main #feat-box {
	float: left;
	width: 131px;
	margin: 20px 0 0 0;
}
#Main #feat-box.one,
#Main #feat-box.two {
	margin-right: 10px;
}

/*** event space ***/
#col-2 #event-space {
	margin: 20px 0 0 0;
}

/*** upcoming events ***/
#col-2 #calendar,
#col-3 #calendar {
	background: #e4f984;
	border: 1px solid #CCC;
	padding: 10px 7px;
	margin:2px 0 0 0;
}
#col-2 #calendar h3,
#col-3 #calendar h3 {
	display: block;
	font-size: 12px;
	font-weight: bold;
	line-height: 13px;
	margin: 0px 7px;
	padding: 0 0 2px 0;
	background: url(http://mexico-beach.com/themes/mexicobeach/images/upcoming-event-bg.gif) no-repeat right;
}
#col-2 #calendar p.more-events,
#col-3 #calendar p.more-events {
	display: block;
	margin: 0px 7px;
	padding: 0 20px 2px 0;
	background: url(http://mexico-beach.com/themes/mexicobeach/images/upcoming-event-bg.gif) no-repeat right;
}
#calendar a {
	color: #11447c;
}
#col-2 #calendar p,
#col-3 #calendar p {
	font-size: 10px;
}
#col-2 #calendar #calendar-event,
#col-3 #calendar #calendar-event {
	border: 1px solid #CCC;
	padding: 2px 7px;
	margin: 10px 0
}
#Main #calendar {
	overflow-x: hidden;
}
#Main #calendar-event {
	border: 1px solid #CCC;
	padding: 6px 10px;
	margin: 0 7px 10px 0;
}
#Main #calendar-event h3 {
	font-size: 13px;
}
#Main #calendar-event p.calendar-date{
	font-size: 10px;
}
#Main #calendar-event p.calendar-description{
	font-size: 11px;
}
#Main #calendar-event p.more-info {
	font-size: 11px;
}
#col-2 #calendar #calendar-event h3,
#col-3 #calendar #calendar-event h3 {
	background: none;
	font-size: 11px;
	font-weight: bold;
	margin: 0;
	padding: 0;
}
#col-2 #calendar #calendar-event p.calendar-description,
#col-3 #calendar #calendar-event p.calendar-description {
	display: none;
}
#col-2 #calendar #calendar-event p.calendar-date,
#col-3 #calendar #calendar-event p.calendar-date {
	font-size: 9px;
	line-height: 10px;
}
#col-2 #calendar #calendar-event p.calendar-date,
#col-3 #calendar #calendar-event p.calendar-date {
	font-size: 10px;
	line-height: 12px;
}

/*** Free Info Packet Form ***/
td.question,
td input,
td select,
td textarea,
.radioPair {
	font-size: 12px;
}
div#msg {
	font-size: 12px;
}
td #Main input {
	width: 250px;
}
td input.formBlockSubmitButton {
	width: auto;
}

/*** Newsletter Styles ***/
#newsletter-web img{
	margin:10px 20px 20px;
}
#newsletter-web hr{
	margin:20px 0;
}
