* { margin:0; padding:0; }

/*  css implementation */

.clearfix:after, .container:after{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix, .container { display:inline-block; }

/* Hides from IE-mac \*/
* html .clearfix, * html .container {height:1%;}
/* End hide from IE-mac */

.clearfix, .container { display:block; }

.clear {clear:both;}

/* row can be in any place */
.row{ clear: both; }

.row:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

/* Hides from IE-mac \*/
* html .row {height: 1%;}
/* End hide from IE-mac */
.column{
	float: left;
	padding: 0;
	margin: 0;
	margin-right: 15px;
	padding-right: 0;
}

.column-right{
    float: right;
	padding: 0;
	margin: 0;
	margin-left: 15px;
	padding-right: 0;
}

.row .fluid{ float: none; display: inline; }

.row .fluid .inner { display:block }

/* Hides from IE-mac \*/
* html .row .fluid .inner{height: 1%;}
/* End hide from IE-mac */

.last{ margin-right:0; padding-right:0; }

.fl-row { position: relative; overflow: hidden; }

	/* Left column */
	.fl-row .fl-column {
		float: left;
	}
		/*
		    Width is set in inner div of column to
		    avoid the use of negative margins
		*/
		.fl-row .fl-column .inner, .fl-row .fl-column-right .inner {
			width: 200px;
		}
	/* Left column */
	.fl-row .fl-column-right{
		float: right;
	}
	/* Middle column */
	.fl-row .fl-column-middle {
		overflow: hidden;
	}
		.fl-row .fl-column-middle .inner {
			width: 100%;
		}

		* html .fl-row .fl-column-middle {
			/* cause hasLayout so middle column will sit between left and right */
			display: inline-block;
		}
        

/* General Style Info */
body {
	background: #ddd;
	color: #333;
	font-family: arial,verdana,'lucida grande',helvetica,sans-serif;
	font-size:14px;
	margin: 0;
}
a { color: #003d4c; text-decoration: none; }
a:hover { color: #003d4c; text-decoration:underline; }
a img {
	border:none;
}
h1, h2, h3, h4 {
	font-weight: normal;
	color: #333;
}
h1 {
	color: #003d4c;
	font-size: 100%;
	margin: 0.1em 0;
}
h2 {
	font-family: arial, 'Gill Sans','lucida grande',helvetica, sans-serif;
	font-size: 150%;
	padding: 0.3em 0;
}
h3, h4 {
	font-family: arial, 'Gill Sans','lucida grande',helvetica, sans-serif;
	font-size: 130%;
	margin: .3em 0 .5em 0;
}
h4 {
	font-size: 110%;
	font-weight: bold;
}

ul, li {
	margin: 0 12px;
}

/* link list details */
ul.list-link, ul.list-link li{
	display: inline;
	list-style: none;
	margin: 0;
	padding:0;
	font-family: arial, verdana, helvetica, sans-serif;
}

ul.list-link li{
	border-right: 1px solid #333;	
}

ul.list-link li.last{
	border-right: none;
}

ul.list-link li a{
	background: none;
	font-weight: normal;
	text-decoration: none;
	padding: 0px .5em;
}

ul.list-link li a:hover{
	background:gray;
}

.header-menu-status .list-link li{
    border-right: none;
}
.header-menu-status .list-link li a {
    padding: 0 .25em;
}
.header-menu-status .list-link li a:hover{
	text-decoration: underline;
}

.vertical-menu li a{
    font-weight: bold;
}

.vertical-menu li ul{
    margin-bottom: .2em;
}

.vertical-menu li ul li{
    border-bottom: none;
    list-style: disc inside;
}

.vertical-menu li ul li a{
    font-weight: normal;
}


.box-round{
	border: #ccc 1px solid;	
	background: #f5f5f5;
}

.box-round-btl{
	background: url('../img/tpl/border-top-left.gif') left top no-repeat;
	margin: -1px;
}

.box-round-btr{
	background: url('../img/tpl/border-top-right.gif') right top no-repeat;	
}

.box-round-bbl{
	background: url('../img/tpl/border-bottom-left.gif') left bottom no-repeat;
}

.box-round-bbr{
	background: url('../img/tpl/border-bottom-right.gif') right bottom no-repeat;
}

.box-round-content{
	padding: .5em .8em .8em .8em;	
}

#content-left .box-round{
	margin-left: .5em;
	font-size: 95%;
}
#content-right .box-round{
	margin-right: .5em;
	font-size: 95%;
}

hr.separator{
	margin: .7em 0 .5em 0;
	border: none;
	border-top: #ccc 1px solid;
	height:0px;
}

/* Layout */
#container {
	text-align: left;
	background: url('../img/tpl/grad-top.gif') top repeat-x;
}

#header{
	padding-top: 14px;	
}

#header .header-top{
	margin: .3em 0 0 0;
	padding-left: 110px;
}

#header .header-bottom{
	background: #eee url('../img/tpl/grad-header.gif') top repeat-x;
}

#header .logo {
	padding: 0;
	margin: 0 0 0 .5em;
	position: relative;
        top: -28px;
}

#header div.column{
	margin:0;
	width: 49.5%;	
}

#header div.header-menu-status{
	text-align: right;
	position: relative;
	top: -.2em;
	font-size: .85em;
    margin-bottom: .3em;
    height: 22px;
}


#header a {
	text-decoration: none;
	color: #369;
	font-weight: normal;
}

#header a:hover {
	background: none;
	text-decoration: none;
}

#header ul.header-menu li{
	display: block;
	float: left;
	margin-left: 1px;
	margin-right: 10px;
	border: none;
	font-size: .95em;
}

#header ul.header-menu li.last{
	float: none;
}

#header ul.header-menu li a{
	font-weight: bold;
	/*
	background: #ccc;
	padding-top: .3em;
	padding-bottom: .3em;
	*/
}

#header ul.header-menu li a:hover, #header ul.header-menu li.active a{
	color: white;
	background: #369;
}

#RES_ID_fb_login_image{
    vertical-align: middle;
    margin-right: 1em;
}

#content{
	background: #eee;
	clear: both;
	color: #333;
	padding: 0;
    padding-bottom: 2em;
	/* overflow: auto; */
}

#content-wrapper-inner{
	width: 100%;
	float: left;
}

#content-main{
    margin: 0 200px 0 200px;
    padding: 0 1em;
}

.one_column #content-main{
    margin: 0;
}


#content-left{
	width: 200px; 
	float: left;
	margin-left: -100%;
}

#content-right{
	width: 200px;
	float:left;
	margin-left: -200px;
}

#footer {
	padding: .8em .5em;
	background: url('../img/tpl/grad-footer.gif') top repeat-x;
	color: #333;
	font-size: .7em;
}

#footer .footer-copy, #footer .footer-link, #footer .footer-power{
	width: 25%;
	margin-right: 0;
}
#footer .footer-link{
	text-align: center;
	width: 50%;
}
#footer .footer-power{
	text-align: right;
}

#footer a{	
	background: none;
	font-weight: normal;
	text-decoration: none;
	color: black;	
}

#footer a:hover{	
	text-decoration:underline;
	color: #930;	
}

div.content-main {
	margin: auto;
}

/* board */
div.board{	
	background: #f5f5f5 url('../img/tpl/grad-board.gif') top repeat-x;
	padding-top: 1em;
    padding-bottom: 1.5em;
	/*margin-top: 1em;*/
}

div.board-column{	
	width: 32%;
}

div.box{
	padding: .3em 1em 1em 1em;
}

/* Tables */
table {
	background: #fff;
	border:1px solid #ccc;
	border-right:0;
	clear: both;
	color: #333;
	margin-bottom: 10px;
	width: 100%;
}
th {
	background: #f2f2f2;
	border:1px solid #bbb;
	border-top: 1px solid #fff;
	border-left: 1px solid #fff;
	text-align: center;
}
th a {
	background:#f2f2f2;
	display: block;
	padding: 2px 4px;
	text-decoration: none;
}
th a:hover {
	background: #ccc;
	color: #333;
	text-decoration: none;
}
table tr td {
	background: #fff;
	border-right: 1px solid #ccc;
	padding: 4px;
	text-align: center;
	vertical-align: top;
}
table tr.altrow td {
	background: #f4f4f4;
}
td.actions {
	text-align: center;
	white-space: nowrap;
}
td.actions a {
	margin: 0px 6px;
}
.cake-sql-log table {
	background: #f4f4f4;
}
.cake-sql-log td {
	padding: 4px 8px;
	text-align: left;
}

/* Paging */
div.paging {
	background:#fff;
	color: #ccc;
	margin-bottom: 2em;
}
div.paging div.disabled {
	color: #ddd;
	display: inline;
}
div.paging span {
}
div.paging span.current {
	color: #000;
}
div.paging span a {
}

/* Scaffold View */
dl {
	line-height: 2em;
	margin: 0em 0em;
	width: 60%;
}
dl.altrow {
	background: #f4f4f4;
}
dt {
	font-weight: bold;
	padding-left: 4px;
	vertical-align: top;
}
dd {
	margin-left: 10em;
	margin-top: -2em;
	vertical-align: top;
}

/* Forms */
form {
	clear: both;
	margin-right: 20px;
	padding: 0;
	width: 80%;
}
fieldset {
    border: none;
	margin-top: 30px;
	padding: 16px 0;
}
fieldset legend {
	background: transparent;
	color: #003d4c;
	font-size: 1.25em;
	font-weight: normal;
    margin-bottom: 1em;
}
fieldset fieldset {
	margin-top: 0px;
	margin-bottom: 20px;
	padding: 16px 10px;
}
fieldset fieldset legend {
	font-size: 1.15em;
	font-weight: normal;
}
fieldset fieldset div {
	clear: left;
	margin: 0 20px;
}
form div {
	clear: both;
	margin-bottom: 1em;
	padding: .5em;
	vertical-align: text-top;
}
form div.input {
	color: #444;
}
form div.required {
	color: #333;
	font-weight: bold;
}
form div.submit {
	border: 0;
	clear: both;
	margin-top: 10px;
	margin-left: 140px;
}
label {
	display: block;
	font-size: 110%;
	padding-right: 20px;
}
input, textarea {
	clear: both;
	font-size: 140%;
	font-family: "verdana", arial, sans-serif;
	padding: 2px;
	width: 100%;
}
select {
	clear: both;
	font-size: 120%;
	vertical-align: text-bottom;
}
select[multiple=multiple] {
	width: 100%;
}
option {
	font-size: 120%;
	padding: 0 3px;
}
input[type=checkbox], input .checkbox {
	clear: left;
	float: left;
	margin: 0px 6px 7px 2px;
	width: auto;
}
input[type=radio], input .radio {
	float:left;
	width:auto;
	margin: 0 3px 7px 0;
}
div.radio label {
	margin: 0 0 6px 20px;
}
input[type=submit], input[type=reset] , input[type=button], input.submit, input.reset, input.button  {
	display: inline;
	font-size: 110%;
	padding: 2px 5px;
	width: auto;
	vertical-align: bottom;
	background: #036;
	color: white;
}

/* Notices and Errors */
div.message {
	clear: both;
	color: #900;
	font-size: 110%;
	font-weight: bold;
	margin: 1em 0;
    border: 1px solid #ccc;
    background: #fff;
    padding: 0.5em;
}
div.error-message {
	clear: both;
	color: #900;
	font-weight: bold;
}
p.error {
	background-color: #e32;
	color: #fff;
	font-family: Courier, monospace;
	font-size: 120%;
	line-height: 140%;
	padding: 0.8em;
	margin: 1em 0;
}
p.error em {
	color: #000;
	font-weight: normal;
	line-height: 140%;
}
.notice {
	background: #ffcc00;
	color: #000;
	display: block;
	font-family: Courier, monospace;
	font-size: 120%;
	line-height: 140%;
	padding: 0.8em;
	margin: 1em 0;
}
.success {
	background: green;
	color: #fff;
}
code{
    padding: .5em;
    border: 1px dashed #999;
    background: #ddd;
    margin: .5em 0;
    display: block;
    font-family: "cor"
}

.margin-t10 {
    margin-top: 10px;
}
.margin-t20 {
    margin-top: 20px;
}

.margin-t30 {
    margin-top: 30px;
}

/*  Actions  */
div.actions ul {
	margin: 0px 0;
	padding: 0;
}
div.actions li {
	display: inline;
	list-style-type: none;
	line-height: 2em;
	margin: 0 2em 0 0;
	white-space: nowrap;
}
div.actions ul li a {
	background:#fff;
	color: #003d4c;
	text-decoration: none;
}
div.actions ul li a:hover {
	color: #333;
	text-decoration: underline;
}

/* Related */
div.related {
	clear: both;
	display: block;
}

.loud{
	font-weight: bold;	
}

/* entered from blueprint */

.small {font-size:.8em;margin-bottom:1.875em;line-height:1.875em;}
.large {font-size:1.2em;line-height:2.5em;margin-bottom:1.25em;}
.hide {display:none;}
.quiet {color:#777;}
.hints,.hints-title,.hints-form {font-size: .8em; color:#666;}
.loud {color:#000;}
.highlight {background:#ff0;}
.added {background:#060;color:#fff;}
.removed {background:#900;color:#fff;}
.first {margin-left:0;padding-left:0;}
.last {margin-right:0;padding-right:0;}
.top {margin-top:0;padding-top:0;}
.bottom {margin-bottom:0;padding-bottom:0;}

/* blue print end */

/* Formatting */
.txt{
    text-align: left;
}
.number{
    text-align: center;
}
.amount{
    text-align: right;
}


.hints-title{
	margin-top: -1em;
	position: relative;
	margin-bottom: 1em;
	font-size: .7em;
}

.hints-form, form input div.hints-form{
    margin:0;
    padding: 0;
    font-weight: normal;
    margin-top: -.5em;
}

/* list widget */
ul.list, ul.list li, ul.list-styled, ul.list-styled li, ul.list-info, ul.list-info li{
	list-style: none;
	margin: 0;
	padding: .2em 0;
}
ul.list-styled{
	border-bottom: 1px solid #ccc;
}
ul.list-styled li{
	border-top: 1px solid #ccc;
	padding: .5em;
}
ul.list-styled li a{
	font-style: italic;
	font-weight: bold;
	color: #930;
}

ul.list-styled li a.title{
	font-style: normal;
}

ul.list-info li{
    margin-bottom: .5em;
    list-style: square;
    margin-left: 16px;
}

ul.list-line{
    
}

ul.list-line li{
    float: left;
    margin-right: 1em;
}

ul.list-line li.last{
    float: none;
    margin-right: 0;
}

ul.glance, ul.glance li{
    list-style: none;
    margin: 0;
    padding: 0;
}
ul.glance li{
    background: url('/img/blue/news.gif') 8px no-repeat;
    margin: .5em 0;
    padding: 8px 8px 8px 35px;
    border: 1px dashed #ccc;
}



div.input{
	border: 1px solid #ccc;
    padding: 1em;
    background: #f5f5f5;
}
input.placeholder, textarea.placeholder{
    color: gray;
}
form div.submit{
	margin-left: 0;
}

div.input legend{
    font-size: 0.9em;
}
/* User Login */
div.text input, div.password input, .form-small input, textarea{
	margin-bottom: .5em;
	border: 1px solid #ccc;
	font-size: 90%;
}

.form-small, .form-small label{
    padding-right:0;
    margin-right: 0;
}

div.text input, div.password input{
    width: 250px;
}

div.text-large input{
    width: 400px;
}

div.text-small input{
    width: 125px;
}

div.checkbox input, div.radio input{
    width: auto;
    margin-right: .5em;
}

div.checkbox label, div.radio label{
    display: inline;
}

div.submit input, div.button input, div.reset input, input.button, input.submit, input.reset{
    width: auto;
	font-size: .9em;
	padding: 1px 2px;
	background: #036;
	color: white;
    border: 1px solid #fff;
    margin-bottom: 0;
}

div.select select, div.date select, .form-small select {
	clear: both;
	font-size: 90%;
	vertical-align: text-bottom;
	margin-bottom: .5em;
}

select option, .form-small option {
	font-size: 90%;
	padding: 0 3px;
}

.location-tag{
    border: 1px solid #CAD8F3;
    margin-right: 5px;
    -moz-border-radius-bottomleft:6px;
    -moz-border-radius-bottomright:6px;
    -moz-border-radius-topleft:6px;
    -moz-border-radius-topright:6px;
    padding: 1px 5px;
    white-space:nowrap;
    background: #DEE7F8 none repeat scroll 0 0;
    font-size: 11px;
}

.notice a{
    color: white;
}

.loading span{
    display:inline-block;
    height: 16px;
    width: 50px;
    background: url('/img/loading.gif') 0px no-repeat;
    margin:0 .5em;
    padding:0 0 0 22px;
}

.phone-link, .add-friend-link, .email-link, .home-link, .search-link, .help-link, #header ul.header-menu li.icon{
    padding-left: 18px;
    display: inline-block;
    height: 18px;
}
.phone-link{
    background: url('/img/blue/phone.gif') no-repeat;
}
.email-link{
    background: url('/img/blue/mail.gif') no-repeat; 
}
.profile-link{
    background: url('/img/blue/user.gif') no-repeat;
}
.request-link{
    background: url('/img/blue/quote.gif') no-repeat;
}
.home-link{
    background: url('/img/blue/home.gif') no-repeat;
}
.search-link{
    background: url('/img/blue/search.gif') no-repeat;
}
.support-link{
    background: url('/img/blue/info.gif') no-repeat;
}
.help-link{
    background: url('/img/blue/question-mark.gif') no-repeat;
}
.default-link{
    background: url('/img/blue/arrow-right.gif') no-repeat;
}
.add-friend-link{
    background: url('/img/blue/plus.gif') no-repeat;
}

.blood-group-medium{
    font-size: 2em;
    color: #993300;
    display: inline-block;
    padding: 3px;
}

.people-list{
    
}

.people-item{
    padding: .5em;
    border-bottom: 1px dashed #ccc;
    background: #eee;

}

.people-item-first{
    border-top: 1px dashed #ccc;
}

.people-item .avatar{
    width: 90px;
}
.people-item .action{
    float: right;
}
.people-item .action ul{
    margin-top: 0; padding-top: 0;
    font-size: .8em;
}
.people-item .blood-group{
    font-size: 2.5em; margin-top: 0; padding:0; color: #900;
}
.people-item .profile-link, .people-item .request-link, .people-item .add-friend-link {
    padding-left: 20px; margin-top: .8em;
}
.people-item .email-link, .people-item .phone-link{
    margin-top: .8em;
}
.people-item .phone-link{
    width: 171px;
    height: auto;
}
.people-item-altrow{
    background: #e8e8e8;
}
.people-item h2{
    padding-top: 0; margin-top: 0;
}
.people-item .add-friend-link{
    font-size: .65em;
}
.people-item .list .add-friend-link{
    font-size: 1em;
}
.people-item .tags{
    width: 450px;
}
.people-item .extra{
    margin-top: .6em; margin-bottom: .5em; white-space:normal;
}
.people-item .extra .location{
    display: inline-block; width: 200px;
}


/* details view */
dl {
    line-height:normal;
    margin: 0em 0em;
    font-size: .9em;
    width: 95%;
    
}
dl.altrow {
	background: #f4f4f4;
}
dt {
	font-weight: normal;
	padding-left: 4px;
	vertical-align: top;
    float: left;
    clear: left;
    width: 110px;
    padding: .5em;
    margin: 0;
    color: #666;
}
dd {
	vertical-align: top;
    font-weight: normal;
    width: 360px;
    float: left;
    padding: .5em;
    margin: 0;
    color: #000;
}
/* profile page information */
div.profile-header, div.profile-friends, div.profile-info, .profile-donations, .profile-badge{
    margin-bottom: 2em;
}

.profile-avatar{
    float: left;
    display: block;
}
.profile-title{
    margin-left: 155px;
}

.profile-title ul li{
    list-style:square;
    margin-left: 1.5em;
}

div.people-avatar{
    width: 100px;
   font-size: 12px;
}

h1.header{
    margin-top: 0; font-size: 1.5em;
}

.box-rect{
    padding: 1em;
    background: #f3f3f3;
    border: 1px solid #ddd;
    margin: 1em 0;
}




/* all control widgets */

.control-bottom{
    margin-top: .5em;
    font-size: .8em;
}
.control-bottom a{
    display: inline-block;
    padding: .3em .5em;
    background: #ddd;
    border: 1px solid white;
}

a.button {
    display:inline-block;
    padding: .2em .5em;
	background: #036;
	color: white;
    border: 1px solid #fff;
}

a.green {
	background: #6c0;
}

a.orange {
	background: orange;
}

a.special-button {
    background:orange;
    color: white;
    border-color: white;
}

ul.control-right{
    float: right;
    clear: right;
    margin: 0;
    list-style:none;
}

ul.control-right li{
    float: right;
    margin: 0;
    padding: 0;
    margin-right: 2px;
}

ul.control-right li a{
    padding: .2em .3em;
    display: inline-block;
    border: 1px solid #ccc;
    font-style:normal;
}

ul.control-right li a:hover{
    border: 1px solid #666;
    text-decoration: none;
}

/*******************************************************************************
                                Widget Style
*******************************************************************************/

.user-list img.avatar{
    vertical-align:middle;
    margin-right: .5em;
    width: 24px;
    height: 24px;
}

/* WALL STYLE */
.wall{
    margin: 0 auto 1em auto;
    font-family: 'lucida grande',tahoma,verdana,arial,helvetica,sans-serif;
    font-size: .85em;    
    padding: 0;
}

.wall-border{
    padding: 5px;
    border: 5px solid #ccc;
}

.wall .wall-title{
    font-size: 1.8em;
}

.wall .post .post-content{
    font-size: 1.1em;
}

.wall .wall-form, .wall .wall-comment-form{
    margin-bottom: 1em;
    background: #ddd;
    padding: .5em;
}

.wall .wall-form .form-wall-title{
    margin-bottom: 1em;
}


.wall a.author{
    font-weight:bold;
}

.wall .wall-posts{
    background: #ccc;
    padding-top: .1em;

}

.wall .wall-posts .post{
    background: #efefef;
    padding: .5em;
    margin-bottom: .1em;

}
.wall .wall-posts .post .content{
    width: 100%;
}

.wall .blog-posts .post-title h2{
    margin-top:0;
    padding-top:0;
}

.wall .blog-posts .post-content{
    margin: 1.5em 0;
}

.wall-comments, .wall-comment-form {
    margin-left: 63px;
    margin-top: 1em;
    margin-right: 150px;
}

.wall-comments .comment{
    padding: .5em;    
    background: #ddd;
    margin-bottom: .1em;
}

.wall .wall-paginator{
    background: #ddd;
    margin-top: .5em;
    padding: .5em 1em;
}

.wall .wall-paginator div{
    display: inline-block;
}

.wall .wall-description{
    margin-bottom: 10px;
}

/* User login form */
.login-form{width: 100%; margin: auto;}
.login-form .inner{ width: 360px; margin: auto; background: #ECEFF5; border: 1px solid #BDC7D8; padding: 1em 0}
.login-form form .input,  .login-form form div.submit{border: none; margin-bottom: .3em; padding: .5px; background: transparent}
.login-form div.submit .row{ padding: 0;}
.login-form #recaptcha_area, .login-form #recaptcha_widget_div{ padding: 0;}

/* Modified error, notice, message box */



.error, .notice, .success {
    border:2px solid #DDDDDD;
    margin-bottom:1em;
    padding:0.8em;
    margin-top: 1em;
}


.error  {
    background:none repeat scroll 0 0 #FBE3E4;
    border-color:#FBC2C4;
    color:#8A1F11;
}

.success  {
    background:none repeat scroll 0 0 #E6EFC2;
    border-color:#C6D880;
    color:#264409;
}

.notice {
    background:none repeat scroll 0 0 #FFF6BF;
    border-color:#FFD324;
    color:#514721;
}