/* RIPTIDE */

html,body,div,span,
applet,object,iframe,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,
del,dfn,font,img,ins,kbd,q,s,samp,
small,strike,sub,sup,tt,var,
dd,dl,dt,li,ol,ul,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: normal;
	font-style: normal;
	font-size: 100%;
	line-height: 1;
	font-family: inherit;
	text-align: left;}
	
	#free-trial {
    position: fixed;text-indent: -99999px;
   	top: 30px;
    right: 30px;
    width:170px;
    height:170px;
    background: url(../images/free-trial.png) no-repeat;}
		
	#free-trial a {
	display: block;
	text-indent: -99999px;
    position: fixed;
    top: 30px;
    right: 30px;
    width:170px;
    height:170px;
    background: url(../images/free-trial.png) no-repeat;}
			
			
			
body, html {
	text-align: center;
	font-family: 'Trebuchet MS', Calibri, Helvetica, Verdana, Arial, sans-serif;
	background: #000 url(../images/bg.jpg) no-repeat center top;
	padding: 0;
	margin: 0;
	width: 100%;}

a {outline:none;}

p {
/* color:#0d346c; */
color:#000;
margin: 0px 0px 20px 0px;
line-height: 1.4;
font-size:13px;
font-family: 'Trebuchet MS', Calibri, Helvetica, Verdana, Arial, sans-serif;}

.intro-paragraph {font-size:18px;}

h5{margin:0px;padding:0px;}

#outer_wrapper {
/*
	border:solid thin red;
*/
	margin: 0 auto;
	width: 970px;
	text-align: left;
	background: #fff;}
	
#inner_wrapper {

/*
	border:solid thin red;
*/
	margin: 0 auto;
	width: 970px;
	float:left;
	text-align: left;
	background: #fff;
    -moz-border-radius: 15px 15px 0px 0px;       /* for Firefox */
    -webkit-border-top-left-radius:15px;
	-webkit-border-top-right-radius:15px;
	-webkit-border-bottom-left-radius:0px;
	-webkit-border-bottom-right-radius:0px;}
	
#top-contact {
	width: 950px;
	margin: 0 auto;
	background: none;
	padding:20px 0px 20px 10px;
	height:20px;}

#top-contact p {
	color:#fff;
	font-size:11px;
	text-align: right;
	width:500px;
	float:right;}

.right {
	float:right;
	margin:0px 20px 20px 20px;}

#header {
	float:left;
	height:auto;
	background: url(../images/brightons-friendliest-gym.gif) no-repeat 260px 20px;
	padding:10px 0px 0px 0px;}

#header img {
	float:right;
	display: inline;
	margin:0px 30px 0px 0px;
	position: relative;}
	
	
	#header #marathon {
		display: block;
		float:right;
		text-indent: -9999999px;
		width:120px;
		height:100px;}
	
	#header-image {float:left;display: inline;margin:10px 0px 10px 10px;}
	
	#benefits-holder-new {width:950px;height:210px;margin:10px 0px 0px 10px;clear:both;}
	
	.benefit-new {float:left;margin:0px 5px 0px 0px}
	
	
	
/* CAPTION */


	.caption { padding:20px; background:#000; color:#ccc; width:145px;}
	.caption strong { color:#fff; }
	.caption em { font-style:italic; font-family:Georgia,serif; }
	.caption a { color:inherit; }
	.caption a:hover { text-decoration:none; }

	.caption.alpha { background-color:rgb(0,0,0); /* <- fallback */ background-color:rgba(0,0,0,0.8); }
	.caption.icon { padding-left:88px; background-image:url(images/camera.png); background-repeat:no-repeat; background-position:20px 20px; }
	.caption.copyright { padding:5px 10px; background:transparent; text-align:right; color:#fff; text-shadow:0 1px 0 rgba(0,0,0,0.5); }
	.caption.copyright span { padding:2px 8px 4px; background:rgba(0,0,0,0.3); border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; }
	.caption.widescreen { padding:10px 20px; }

h1 {
	display:inline;
	float:left;
	width:247px;
	height:110px;
	background: url(../images/riptide-logo.jpg) no-repeat;
	margin:0px 0px 0px 15px;
	font-size: 60px;
	text-indent: -9999px;}
	
h1 a {
	display:inline;
	float:left;
	width:247px;
	height:110px;
	background: url(../images/riptide-logo.jpg) no-repeat;
	margin:0px 0px 0px 0px;
	font-size: 60px;
	text-indent: -9999px;}

/* NAVIAGTION */

#navigation {
	width:950px;
	margin:10px 0px 0px 10px;
	float:left;
	padding:5px 0px 5px 0px;
	display: inline;
	background: #ffffff;
	border-top: solid 1px #000;
	border-bottom: solid 1px #000;}

#navigation ul li {
	display: inline;
	padding:0px;
	margin:0px;}

#navigation ul {
	padding-left:0px;
	width: 800px;float:left;}

#navigation ul li a {
	display: inline;
	padding:5px 5px 4px 5px;
	margin:0px;
	background:none;
	text-transform: uppercase;
	font-family: calibri, "century gothic", Tahoma, arial, sans-serif;
	text-decoration: none;
	font-size: 14px;
	color:#000;}
	
	#navigation li.join-now-nav a {background:#477ba6;color:#fff;}

#navigation ul li a:hover {
	background: black;
	color:#fff;}
	
#social {
/* 	border:solid thin red; */
	float:left;
	width:100px;}
	
	#social a {float:left;display:block;width:16px;height:16px;text-indent: -99999px;}

	.facebook-nav {
	float:left;display:block;width:16px;height:16px;background: url(../images/facebook-twitter-icons.jpg) no-repeat;}

	.twitter-nav {
	float:left;display:block;width:16px;height:16px;background: url(../images/facebook-twitter-icons.jpg) no-repeat -16px 0px;margin:0px 0px 0px 5px;}
	
#share-this {width:150px;margin: 10px 0px 0px 80px;}

#opening-times {float:right;display: block;width:380px;height:102px;background:url(../images/opening-times-bg.jpg) no-repeat;margin:0px 10px 0px 0px;color:white;
	-webkit-border-radius: 8px;    /* for Safari */
	-moz-border-radius: 8px;       /* for Firefox */}

#opening-times h2 {margin:10px;}

#opening-times p  {margin:0px 0px 0px 10px;color:#fff;}

#info-holder-new h4 {
	margin:0px 0px 10px 0px;
	padding: 0px;
	text-transform: uppercase;}

#about-riptide-new {

/* border:solid thin red; */
	float:left;
	width:300px;
	margin:10px 0px 0px 20px;}

#twitter-new {

/* border:solid thin red; */
	float:left;
	width:300px;
	margin:10px 10px 0px 10px;}

#media-new {

	/* border:solid thin red; */
	float:left;
	width:300px;
	margin:10px 0px 0px 0px;}
	
	
	#media-new ul {
	list-style-type: none;}
	
	#media-new ul li a {
	
	display:block;
	width:185px;
	height:40px;
	text-indent: -99999px;
	background:url(../images/media-links.jpg) no-repeat;}
	
		#media-new ul li#video-link a {background-position: 0px -45px;}
		#media-new ul li#find-us-link a {background-position: 0px -90px;}
#flash-banner {
	/*
	border:solid thin red;
	*/
	float:left;
	display: inline;
	background: #ccc url(../images/flash_holder.jpg);
	width:637px;
	height:191px;
	margin: 10px 0px 10px 10px;}

#main-content {
	float:left;
	display:inline;
	width:658px;
	background: #fff;
	margin:10px 0px 0px 10px;
	padding:0px;}

#main-content p {
	margin-left:20px;
	margin-right:20px;}

.banner {margin:20px 0px 0px 20px;}

#introduction-text {
	float:left;
	margin:10px 0px 0px 10px;
	background: none;
	width:637px;}

h2.welcome-to-riptide {
	display: block;
	background:url(../images/the-best-gym-for-you.png);
	width:550px;
	clear:both;
	height:102px;
	float:left;
	text-indent: -999999px;
	margin:0px 0px 5px 10px;
	padding:0px 0px 0px 0px;}

h2 {	
	font-size:25px;
	margin:20px 0px 20px 20px;}

#promo-banners-container {
	float:left;
	display:inline;
	background: none;
	width:650px;
	margin:10px 0px 0px 3px;}
	
	#promo-page ul {padding:0px 0px 20px 0px;}
	#promo-page li {
	
	list-style-type: disc;
	padding: 5px;
	margin:5px 0px 5px 35px;
	font-size:15px;
	line-height:1.5;}
	
	#promo-page p {font-size:15px;}

#gallery-banner {
	float:left;
	display:inline;
	width:324px;
	height:111px;
	background:url(../images/gallery-banner.png);
	margin:0px 0px 0px 0px;}

#gallery-banner a {
	display:block;
	width:324px;
	height:111px;
	background:url(../images/gallery-banner.png);
	text-indent: -99999px;}

#promo-banner {
	float:left;
	display:inline;
	width:324px;
	height:111px;
	background:url(../images/promotion-banner.png);
	margin:0px 0px 0px 0px;}

#promo-banner a {
	display:block;
	width:324px;
	height:111px;
	background:url(../images/promotion-banner.png);
	text-indent: -99999px;}

#social-network-links {
	float:left;
	display: inline;
	height:111px;
	width:648px;
	display:inline;
	margin:0px 0px 0px 5px;
	background:url(../images/social-footer_bg.png) no-repeat;}

#latest-blog-entry {
	float:left;
	width:320px;
	background: none;
	/*
	border: solid thin red;
	*/
	margin:20px 0px 0px 20px;}

#latest-blog-entry p {margin:0px;}

#latest-blog-entry a {
	text-decoration: none;
	color:#0d346c;}

#latest-blog-entry a:hover {color:#fff;}

#latest-blog-entry h4 {
	margin:0px 0px 10px 0px;
	padding:0px 0px 0px 0px;
	background:url(../images/latest-blog-entry-text.png) no-repeat;
	display:block;
	width:165px;
	height:15px;
	text-indent: -9999px;}

#follow-riptide {
	/*
	border:solid thin red;
	*/
	float:right;
	background: none;
	width: 250px;
	display:inline;
	margin:20px 0px 0px 0px;}

#follow-riptide a {text-indent: -99999px;}

#follow-riptide h4 {
	margin:0px 0px 0px 0px;
	padding:0px 0px 10px 0px;
	background:url(../images/follow-riptide-text.png) no-repeat;
	display:block;
	width:153px;
	height:15px;
	text-indent: -9999px;}

#follow-links li {display:inline;}

ul li#twitter a {
	display:inline;
	width:102px;
	height:38px;
	float:left;
	background:url(../images/twitter-facebook_btn.jpg) 0px 0px;
	margin:0px 0px 0px 0px;}

ul li#twitter a:hover {
	background-position: 0px -38px;}

ul li#facebook a {
	display:inline;
	width:102px;
	height:38px;
	background:url(../images/twitter-facebook_btn.jpg) -102px 0px;
	float:left;
	margin:0px 0px 0px 15px;}

ul li#facebook a:hover {background-position: -102px -38px;}

#secondary-content {
	background: #fff url(../images/main-content_bg.jpg) repeat-x;
	float:right;
	width:280px;
	display: inline;
	margin:10px 10px 0px 0px;
	padding:0px;
	/*
	border:solid thin red;
	*/	
	-webkit-border-radius: 8px;    /* for Safari */
	-moz-border-radius: 8px;       /* for Firefox */}

#join-now {
	width:262px;
	height:200px;
	margin: 10px 0px 0px 10px;
	display:inline;
	background: url(../images/join-now.png) no-repeat;
	float:left;}

#join-now a {
	width:262px;
	height:250px;
	display:block;
	float:left;
	background: url(../images/join-now.png) no-repeat;
	text-indent: -9999px;}

#testimonials {
	width:262px;
	height:260px;
	margin: 10px 0px 0px 10px;
	display:inline;
	background: url(../images/testimonials.png) no-repeat;
	float:left;}

#testimonials a {
	margin:19px;
	text-decoration: none;
	color:#fff;}

#testimonials-page p {font-size:15px;}

#testimonials p {
	font-size: 14px;
	margin:75px 25px 0px 20px;
	color:#fff;
	line-height: 1.1;}

/**#mailing-list {
	width:262px;
	height:261px;
	margin: 10px 0px 0px 10px;
	display: inline;
	float:left;
	background: url(../images/mailing-list_bg.png) no-repeat;}

#mailing-list h4 {
	display:block;
	width:216px;
	height:36px;
	background: url(../images/mailing-list_title.png) no-repeat;
	margin:20px 0px 0px 20px;
	text-indent: -9999px;}

#mailing-list p {
	margin:10px 20px 10px 20px;
	color:#fff;}

#form-holder {
	padding:0px;

	width: 220px;
	height:auto;
	background:none;
	margin:0px 0px 0px 20px;
	color:#FFF;
	font-size:14px;}

.col1 {
	text-align: right;
	width: 70px;
	height: 25px;
	margin: 0;
	float: left;
	margin-right: 2px;
	padding-top:5px;
	background: url(images/bg_label.gif) no-repeat;}

.col2 {
	width: 140px;
	height: 25px;
	display: block;
	float: left;
	margin: 0;
	background: url(images/bg_textfield.gif) no-repeat;}

.date-col {
	width: 190px;
	height: 31px;
	display: block;
	float: left;
	margin: 0px 0px 0px 0px;
	background: url(images/bg_textfield.gif) no-repeat;}

.date {padding-left:3px;}

.more-info {
	width: 165px;
	height: 25px;
	display: block;
	float: left;
	margin: 0;
	padding-top:5px;
	font-size: 10px;
	background: none;}

.col2comment {
	width: 195px;
	height: 31px;
	margin: 0;
	display: block;
	float: left;
	background: #fff;}

.col1comment {
	text-align: right;
	width: 135px;
	height: 31px;
	float: left;
	display: block;
	margin-right: 2px;
	padding-top:5px;
	background: url(images/bg_label_comment.gif) no-repeat;}

.radio {
	text-align: right;
	width: 160px;
	height: 25px;
	float: left;
	display: block;
	margin-right: 2px;
	background: url(images/bg_label_comment.gif) no-repeat;}

div.row {
	clear: both;
	width: 230px;}

#submit {
	font-family: georgia, serif;
	text-align: center;
	display: inline;
	width:36px;
	height:31px;
	color:#000;
	clear: both;} 

div.myButton input {
	background:url(../images/submit_btn.jpg) no-repeat;
	cursor:pointer;
	width: 89px;
	height: 31px;
	border: none;
	margin: 10px 0px 0px 0px;}

.input {
	background-color: #fff;
	color: #000;
	margin: 4px 0 0px 0px;
	padding: 1px;
	border: 1px solid #8595B2;}

.textarea {
	border: 1px solid #8595B2;
	background-color: #fff;
	font: 11px/14px "Lucida Grande", "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #5A698B;
	margin: 4px 0 5px 8px;}**/

#find-us {
	width:262px;
	height:228px;
	display:inline;
	margin: 10px 0px 0px 10px;
	float:left;
	background: url(../images/find-us.png) no-repeat;}

#find-us a {
	width:262px;
	height:228px;
	display:block;
	float:left;
	background: url(../images/find-us.png) no-repeat;
	text-indent: -9999px;}

#footer {
	clear:both;
	background: #fff;
	width:970px;
	padding:20px 0px;
	text-align: center;
	margin: 0 auto;
	margin-bottom:20px;
	-moz-border-radius: 0px 0px 15px 15px;       /* for Firefox */
	-webkit-border-top-left-radius:0px;
	-webkit-border-top-right-radius:0px;
	-webkit-border-bottom-left-radius:15px;
	-webkit-border-bottom-right-radius:15px;}

#footer ul {
	text-align: left;
	padding: 10px 0px 10px 20px;
	width:930px;
	margin:10px 0px 0px 10px;
	background: #a2c0db;
	-webkit-border-radius: 5px;   /* for Safari */
    -moz-border-radius: 5px;       /* for Firefox */}
    
#footer ul li {
	display: inline;}

#footer ul li a {
	text-decoration: none;
	font-size: 12px;
	padding:0px 3px 0px 3px;
	color:#0d346c;}

#gallery {
	margin:0px 0px 10px 40px;}

#gallery img {
	margin:0px 0px 8px 8px;
	border:solid 1px black;}

/* -------------FITNESS GOALS------------- */

.fitness-goal {
	background:red;
	float:left;
	width: 300px;
	height:194px;
	margin:0px 0px 18px 18px;}

#fitness-goals-nav {
	/*
	background:red;
	*/
	width:260px;
	margin:20px 0px 10px 10px;}

#fitness-goals-nav ul {
	list-style: none;}

#fitness-goals-nav li a {
	background: #0072bc;
	color:#fff;
	width:250px;
	text-decoration: none;
	font-size:14px;
	display:block;
	margin:1px;
	padding:8px 0px 8px 8px;}

#fitness-goals-nav li a:hover {
	background: #000;}

#map_canvas {
	margin:0px 0px 0px 20px;}

.PT-name {
	color:#0d346c;
	font-weight: bold;}

#feedback {
    position: fixed;
    bottom: 0px;
    right: 0px;
    width:100px;
    height:100px;
    background: url(../images/feedback-corner.png) no-repeat;}

#feedback a {
	display: block;
	text-indent: -99999px;
    position: fixed;
    bottom: 0px;
    right: 0px;
    width:100px;
    height:100px;
    background: url(../images/feedback-corner.png) no-repeat;}

#benefits-holder {
	float:left;
	display: inline;
	border:solid thin red;
	clear:both;
	width:612px;
	margin:0px 0px 10px 0px;}


#benefits-holder div {
	float:left;
	width:550px;
	height:auto;
	display: inline;
	margin:0px 0px 0px 10px;
	padding:4px 0px 4px 0px;}


.benefits-sea-view {background:url(../images/seaviews.png) no-repeat left top;}
.benefits-pt {background:url(../images/pt-benefit-thumb.png) no-repeat left top;}
.benefits-bikes {background:url(../images/bikes-benefit-thumb.png) no-repeat left top;}
.benefits-personal-exercise {background:url(../images/personal-exercise.png) no-repeat left top;}
.benefits-small-price {background:url(../images/smallprice-benefit-thumb.png) no-repeat left top;}
.benefits-personal-attention {background:url(../images/personal-attention-benefits-thumbs.png) no-repeat left top;}

#main-content #benefits-holder p {
	margin:0px 0px 0px 0px;
	padding:0px;}

#main-content #benefits-holder h5 {
	color:#0d346c;
	margin:0px 0px 0px 0px;
	padding:0px;
	line-height: 1.3;
	text-transform: uppercase;}

ul#health-points {
	width:500px;
	background:#0072bc;
	padding:10px 10px 10px 40px;
	-webkit-border-radius: 15px;    /* for Safari */
    -moz-border-radius: 15px;       /* for Firefox */
 	margin:10px 0px 20px 20px;}

#health-points li {
	color:#fff;
	padding:10px;
	font-size: 14px;}

.trainer p {margin:0px;font-size: 14px;}

.trainer h5 {
font-size: 20px;
margin:0px 0px 8px 20px
}

.trainer {
	/*
	border:solid thin red;
	*/
	padding:10px 0px;
	margin:10px 0px 0px 20px;
	background: #a2c0db;
	width:600px;
	-webkit-border-radius: 8px;    /* for Safari */
    -moz-border-radius: 8px;       /* for Firefox */}

.facility {
	/*
	border:solid thin red;
	*/
	padding:10px 0px;
	margin:10px 0px 0px 20px;
	background: #a2c0db;
	width:600px;
	-webkit-border-radius: 8px;    /* for Safari */
    -moz-border-radius: 8px;       /* for Firefox */}

.facility h5 {
	font-size: 20px;
	margin:0px 0px 8px 20px}

.facility p {margin:0px;font-size: 14px;}

.facility h6 {
	font-size: 16px;
	margin:10px 0px 8px 20px}

#bottom-statement {
	background: #a2c0db;
	width:560px;
	font-size: 18px;
	margin:10px 0px 0px 18px;
	line-height: 1.3;
	height:auto;
	zoom:1;
	padding:20px 20px;
	-webkit-border-radius: 8px;    /* for Safari */
    -moz-border-radius: 8px;       /* for Firefox */
	clear:both;}

#twitter_update_list {
	/*
	border:solid thin red;
	*/
	width:300px;
	font-size: 13px;
	list-style-type: none;}

/* PRICES */

#prices {
	margin:0px 0px 0px 20px;}
	
#prices td {
	padding: 10px;}

#prices table {
	border:solid thin #ccc;	
	background: #fff;}
	




/* 
	style.css
	
	CSS Contact Form
	
	v1.0
	
	Created by eucalyptuss
	Copyright 2011 Mikolaj Dobrucki. All rights reserved.
*/

#form-content { /* background */
 padding: 20px;
 margin-top: 20px;
/* decoration */
 background-color: #f6f6f6;
 border: solid 1px #ccc;
/*border radius */
 -webkit-border-radius: 4px;
 -moz-border-radius: 4px;
 border-radius: 4px;
}

/*
   ===============================
   =========== FIELDS ============
   =============================== 
*/

.form input, .form textarea, .form select {
 padding: 6px;
 font: normal 14px/14px arial, helvetica, sans-serif;
/* decoration */
 border: solid 1px #ccc;
 background: -o-linear-gradient(top, #f8f8f8, #fff  30px);
 background: -moz-linear-gradient(top, #f8f8f8, #fff  30px);
 background: -webkit-linear-gradient(top, #f8f8f8, #fff  30px);
 -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
 -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
/*border radius */
 -webkit-border-radius: 4px;
 -moz-border-radius: 4px;
 border-radius: 4px;
}

.form p { /* neccessery to make tooltips working */
position: relative;
}

.form input { width: 250px; } .form select { width: 264px } .form textarea { width: 400px; height: 150px; } /* dementions of the fields */

.form label {
  font: normal 14px/14px arial, helvetica, sans-serif;
  color: #777;
  width: 200px;
  display: inline-block;
}

.form label span { /* red mark on required fields */
color: red;
}

.form .text label {
float: left;
margin-right: 4px;
line-height: 30px;
}

input:hover, textarea:hover { /* hover effects */
 border: solid 1px #aaa;
}

input:focus, textarea:focus{ /* focus effects */
 border: solid 1px #aaa;
 background: -o-linear-gradient(top, #f0f0f0, #fafafa  30px);
 background: -webkit-linear-gradient(top, #f0f0f0, #fafafa  30px);
 background: -moz-linear-gradient(top, #f0f0f0, #fafafa  30px);
}

.form .error-input { /* error state */
 border: solid 1px #eb5339;
 -moz-box-shadow: 0 0 6px 1px #fccac2;
 -webkit-box-shadow: 0 0 6px 1px #fccac2;
 box-shadow: 0 0 6px 1px #fccac2;
}

/*
   ===============================
   ======== SUBMIT BUTTON ========
   =============================== 
*/

.submit input { /* normal state */
 height: 40px;
 width: 120px;
 margin-left: 598px;
/* backgorund */
 background: -webkit-linear-gradient(#fbfbfb, #c6c6c6);
 background: -moz-linear-gradient(#fbfbfb, #c6c6c6);
 background: -o-linear-gradient(#fbfbfb, #c6c6c6);
 background-color: #ccc;
/* shadows and highlights */
 -webkit-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.8) inset;  
 -moz-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.8) inset;  
 box-shadow: 0 1px 1px rgba(255, 255, 255, 0.8) inset;
/* border */
 border: 1px solid #ccc;
}

.submit input:hover { /* hover state */
 background: -wekbit-linear-gradient(#fdfdfd, #d5d5d5);
 background: -moz-linear-gradient(#fdfdfd, #d5d5d5);
 background: -o-linear-gradient(#fdfdfd, #d5d5d5);
 background-color: #ddd;
}

.submit input:active { /* active state */
 background: -webkit-linear-gradient(#d5d5d5, #fafafa);
 background: -moz-linear-gradient(#d5d5d5, #fafafa);
 background: -o-linear-gradient(#d5d5d5, #fafafa);
 background-color: #fbfbfb;
}

/*
   ===============================
   =========== TOOLTIP ===========
   =============================== 
*/

form .tooltip:before { /* triangle's border */
 border: solid 8px red;
 border-color: transparent #4d8fcb transparent transparent;
 content: '';
 position: absolute;
 right: 216px;
 bottom: 6px;
 }
 
form .tooltip:after { /* triangle */
 border: solid 7px red;
 border-color: transparent #d0e4f4 transparent transparent;
 content: '';
 position: absolute;
 right: 216px;
 bottom: 7px;
}

form .tooltip {
 width: 200px;
 padding: 8px;
 padding-top: 9px;
 margin-left: 10px;
 font: normal 12px/12px arial, helvetica, sans-serif;
/* position */
 position: absolute;
 bottom:0;
 left: 468px;
 display: none;
/* border radius */
 -webkit-border-radius: 4px;  
 -moz-border-radius: 4px;  
 border-radius: 4px;
/* background */
 background: #d0e4f4;
/* shadows and highlights */
 -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15),
0 2px 1px rgba(255, 255, 255, 0.5) inset,
0 -2px 2px #bbd9f1 inset;  
 -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15),
0 2px 1px rgba(255, 255, 255, 0.5) inset,
0 -2px 2px #bbd9f1 inset;  
 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15),
0 2px 1px rgba(255, 255, 255, 0.5) inset,
0 -2px 2px #bbd9f1 inset;
/* border */
 border: 1px solid #4d8fcb;
}

form p:hover .tooltip { /* viseable on hover */
display: block;
}

/*
   ===============================
   ======== ERROR BUBBLE =========
   =============================== 
*/

form .bubble:before { /* triangle's border */
 border: solid 8px red;
 border-color: transparent #eb5339 transparent transparent;
 content: '';
 position: absolute;
 right: 216px;
 bottom: 6px;
 }
 
form .bubble:after { /* triangle's */
 border: solid 7px red;
 border-color: transparent #fccac2 transparent transparent;
 content: '';
 position: absolute;
 right: 216px;
 bottom: 7px;
}

form .bubble { /* main part of a tooltip */
 width: 200px;
 padding: 8px;
 padding-top: 9px;
 margin-left: 10px;
 font: bold 12px/12px arial, helvetica, sans-serif;
 position: absolute;
 bottom:0;
 left: 468px;
/* border radius */
 -webkit-border-radius: 4px;  
 -moz-border-radius: 4px;  
 border-radius: 4px;
/* background */
 background: #fccac2;
/* shadows and highlights */
 -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15),
0 2px 1px rgba(255, 255, 255, 0.5) inset,
0 -2px 2px #fcb7ac inset;  
 -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15),
0 2px 1px rgba(255, 255, 255, 0.5) inset,
0 -2px 2px #fcb7ac inset;  
 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15),
0 2px 1px rgba(255, 255, 255, 0.5) inset,
0 -2px 2px #fcb7ac inset;
/* border */
 border: 1px solid #eb5339;
}

/*
   ===============================
   ===== NOTIFICATION BOXES ======
   =============================== 
*/

.box {
 min-width: 100px;
 padding: 20px 50px;
 margin-bottom: 20px;
 font: normal 12px/12px arial, helvetica, sans-serif;
/* border radius */
 -webkit-border-radius: 4px;  
 -moz-border-radius: 4px;  
 border-radius: 4px;
}

.box strong {
margin-right: 10px;
}


.edit {
/* background */
 background: url(../img/edit.png), #ffeaa8;
 background-position: 10px center;
 background-repeat: no-repeat;
 background-color: #ffeaa8; /* for IE */
/* shadows and highlights */
 -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15),
0 2px 1px rgba(255, 255, 255, 0.8) inset,
0 -2px 2px #ffe285 inset;  
 -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15),
0 2px 1px rgba(255, 255, 255, 0.8) inset,
0 -2px 2px #ffe285 inset;  
 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15),
0 2px 1px rgba(255, 255, 255, 0.8) inset,
0 -2px 2px #ffe285 inset;
/* border */
 border: 1px solid #f9b416;
}


.error {
/* background */
 background: url(../img/error.png), #fccac2;
 background-position: 10px center;
 background-repeat: no-repeat;
 background-color: #fccac2; /* for IE */
/* shadows and highlights */
 -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15),
0 2px 1px rgba(255, 255, 255, 0.5) inset,
0 -2px 2px #fcb7ac inset;  
 -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15),
0 2px 1px rgba(255, 255, 255, 0.5) inset,
0 -2px 2px #fcb7ac inset;  
 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15),
0 2px 1px rgba(255, 255, 255, 0.5) inset,
0 -2px 2px #fcb7ac inset;
/* border */
 border: 1px solid #eb5339;
}



		#content h1 {color: #333; font-weight: normal; border-bottom: 1px solid #bbb; margin: 25px 0px; padding-bottom: 7px;}
		#content h2 {color: #777; font-weight: normal; margin: 20px 0px;}
		#container { width: 620px; margin: auto;}