/* ------ NOTES ---------------------------------------------------------------

Master Screen Style for WaitListr, http://www.waitlistr.com.

--------- UPDATE INFO ---------------------------------------------------------

Last updated: 28 July 2008
Last update made by: 

--------- CONTENTS ------------------------------------------------------------

1: BODY AND UNIVERSAL RESET
2: GLOBAL NAVIGATION
	a) Top navigation and user box
3: PAGE STRUCTURE
	a) Contianers
	b) Header
	c) Main content
	d) Footer
4: SECTION SPECIFIC STYLES
	a) Home page
	b) Signup page
	c) Start page
	d) Your list
	e) Gift tips and News
	f) Your profile and Tools
5: LISTS
6: FORMS & TABLES
	a) Standard forms
	b) Forms on Edit list page
	c) Tables for forms
7: GLOBALS
	a) Links
	b) Typography
8: MISC
	
---------------------------------------------------------------------------- */




/* 1: BODY AND UNIVERSAL RESET
============================================================================ */

body {
 margin: 0px;
 padding: 40px 0px;
 background: #f2f2f2;
 color: #555;
 font: 12px/160% "Helvetica Neue", Helvetica, Verdana, Arial, 'Bitstream Vera Sans', sans-serif;
 text-align: center;
}

a {
 color: #1c488f;
 text-decoration: none;
}
a:hover {
 text-decoration: underline;
}

/* Reset margin and padding for all elements

* {margin: 0; padding: 0;} */

/* 3: PAGE STRUCTURE
============================================================================ */

#container {
 background: #FFFFFF;
 width: 962px;
 margin: 0 auto;
 padding-top: 12px;
 text-align: left;
 position: relative;
 background: url(../images/box_container.gif) no-repeat top left;
}
#wrapper {
 padding: 0 18px;
 position: relative;
 background: url(../images/box_container_sides.gif) repeat-y top left;
}
#footer {
 color: #CCC;
 padding: 18px 48px;
 position: relative;
 background: url(../images/box_container.gif) no-repeat bottom left;
 clear: both;
}
#footer a {
 color: #999;
}

#header {
 background: #04a0c2;
 padding: 12px;
 color: #FFF;
 height: 90px;
 position: relative;
}
#header a {
 color: #FFF;
 text-decoration: none;
}
#header a:hover {
 text-decoration: underline;
}
#header h1 {
 border: none;
 background: url(../images/logo-wl.png) no-repeat top left;
 cursor: pointer;
 width: 176px;
 height: 136px;
 top: 10px;
 left: 10px;
 text-decoration: none;
 font-size: 1%;
 text-indent: -9999px;
 position: absolute;
}
#header ul {
 padding: 0;
 margin: 0;
 position: relative;
}
#header ul li {
 float: left;/**/
 padding: 0;
 list-style: none;
 position: relative;
}
#header li a {
 display: block;
 text-decoration: none;
}

#header ul#nav {
 padding: 15px 0 30px 0;
 margin: 0 0 0 200px;
 top: 50px;
}
#header ul#nav li {
 padding: 0 30px 0 0;
}
#header  ul#nav li a {
 font-size: 14px;
}

#header ul#log {
 position: absolute;
 top: 20px;
 right: 25px;
 font-size: 11px;
}
#header ul#log li {
 padding: 0 0 0 16px;
}
#header ul#log li.user {
 padding: 5px 0 0 0;
}
#header ul#log li.user a {
 display: inline;
}
#header ul#log li.login a {
 width: 74px;
 height: 27px;
 padding: 5px 0 0 0;
 font-size: 11px;
 text-transform: uppercase;
 letter-spacing: .1em;
 text-align: center;
 background: url(../images/button_tab_on_blue.png) no-repeat top right;
}

#content {
 padding: 40px 30px;
 position: relative;
}


/* 6: FORMS AND TABLES
============================================================================ */

/* a) Standard forms */

form {margin-top: 1em;}
form.alt {margin: 0;}

label {
 color: #4d5762;
 font-size: 11px;
 font-family: Arial, Verdana, sans-serif;
 font-weight: bold;
 text-transform: uppercase;
 display: block;
 white-space: nowrap;
 padding: 4px 0 0 0;
}

#search {
 padding-top: 20px;
}
input, textarea {
 width: 336px;
 padding: 4px;
 border: 2px solid #CCC;
 background-color: #F9F9F9;
 font-size: 130%;
 font-family: Arial, Verdana, sans-serif;
}
.checkbox {
 width: auto;
 padding: 0;
 border: none;
 background-color: #F9F9F9;
 font-size: 12px;
}
input.button, input.button_open, input.button_close, input.button_x, input.button_check {
 color: #FFF;
 width: 147px;
 height: 38px;
 border: none;
 font-size: 120%;
 font-weight: bold;
 text-transform: uppercase;
 background: url(../images/button_green_background.gif) no-repeat bottom left;
 cursor: pointer;
}
input.button_open {
 width: 171px;
 padding-left: 25px;
 background: url(../images/button-open.png) no-repeat bottom left;
}
input.button_close {
 width: 171px;
 padding-left: 25px;
 background: url(../images/button-close.png) no-repeat bottom left;
}
input.button_check {
 width: 171px;
 padding-left: 25px;
 background: url(../images/button-check.png) no-repeat bottom left;
}
input.button_x {
 width: 171px;
 padding-left: 25px;
 background: url(../images/button-x.png) no-repeat bottom left;
}
#search input.button {
 border: none;
 background: url(../images/button_search.gif) no-repeat top left;
 cursor: pointer;
 width: 112px;
 height: 37px;
 text-decoration: none;
 font-size: 1%;
 text-indent: -9999px;
}
#search input {vertical-align: middle;}

form table {
 padding: 5px;
}
form table td {
 padding-left: 0;
}
form table label {
 padding: 0;
}

.notice {
 padding: 5px;
 background: #ffefc3;
 border-top: 2px solid #ffce7a;
 border-bottom: 2px solid #ffce7a;
}
.alert, .error {
 background: #ffcdc3;
 border-top: 2px solid #ff837a;
 border-bottom: 2px solid #ff837a;
 padding: 5px;
}
.blueinfo {
 background: #c3e6ff;
 border-top: 2px solid #7ad4ff;
 border-bottom: 2px solid #7ad4ff;
}


/* 7: ROUNDED CORNER FUNCTION STYLES
============================================================================ */


/* Top corners and border */
.bt {
	height:3px;
	margin:0 0 0 18px;
	background:url(../images/box_shadow.gif) no-repeat 100% 0; /**/
}
.bt div {
	position:relative;
	left:-18px;
	width:18px;
	height:3px;
	background:url(../images/box_shadow.gif) no-repeat 0 0;
	font-size:0;
	line-height:0;
}
/* Bottom corners and border */
.bb {
	height:10px;
	margin:0 0 0 12px;
	background:url(../images/box_shadow.gif) no-repeat 100% 100%;
}
.bb div {
	position:relative;
	left:-12px;
	width:12px;
	height:10px;
	background:url(../images/box_shadow.gif) no-repeat 0 100%;
	font-size:0;
	line-height:0;
}
/* Left border */
.i1 {
	padding:0 0 0 3px;
	background:url(../images/box_shadow_borders.gif) repeat-y 0 0;
}
/* Right border */
.i2 {
	padding:0 3px 0 0;
	background:url(../images/box_shadow_borders.gif) repeat-y 100% 0;
}
/* Wrapper for the content. Use it to set the background colour and insert some padding between the borders and the content. */
.i3 {
	display:block;
	margin:0;
	padding:0px;
	/*background:#fff;;*/
}
/* Make the content wrapper auto clearing so it will contain floats (see http://positioniseverything.net/easyclearing.html). */
.i3:after {
	content:"."; 
	display:block; 
	height:0; 
	clear:both; 
	visibility:hidden;
}
.i3 {display:inline-block;}
.i3 {display:block;}
/* Default CSS ends here */

