/* 
	client: 			New2theCity
	developed by: 		Rippleffect
	initial design: 	Katy Dell
	xhtml/css:			Michael Braithwaite
	developer: 			Stephen Todd
	
	css:				structure
*/

* {
	margin:0;
	padding:0;
}

body {
	overflow-y:auto;
	overflow-x:hidden;
}

/* clear fix stuff */

.clr:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.clr {
    display: inline-block;
}

html[xmlns] .clr {
    display: block;
}

* html .clr {
    height: 1%;
}

/* main structure */

#container {
	width:950px;
	margin:0 auto;
	overflow:hidden;
	display:block;
}

#container #header {
	width:950px;
	float:left;
	margin:0 0 15px 0;
}

#container #main-content {
	width:950px;
	float:left;
	clear:both;
}

#container #main-content #left-col {
	float:left;
	width:218px;
}

#container #main-content #right-col {
	float:right;
	width:727px;
}

#container #footer {
	clear:both;
	width:935px;
	height:22px;
	background-image:url(/assets/images/footer/footer-bg.png);
	background-repeat:no-repeat;
	background-position:top left;
	padding:7px 0 0 15px;
	margin:5px 0 10px 0;
}

#container p.copyright {
	margin:0 0 30px 0;
	float:left;
	font-size:1em;
	color:#888;
}

#container #social-bookmarks {
	clear:both;
	width:950px;
	display:block;
	background-repeat:no-repeat;
	background-position:top left;
	margin:5px 0 15px 0;
}

/** header **/

/*** main nav ***/

#container #header ul#main-nav {
	float:right;
	margin:30px 0 0 0;
	text-align:right;
}

/** leftcol **/

/*** calls to action ***/

#container #main-content #left-col .call {
	width:192px;
	float:left;
	clear:left;
	background-repeat:no-repeat;
	background-position:top left;
	padding:10px 13px 0 13px;
	margin:0 0 5px 0;
}

#container #main-content #left-col .pink {
	height:140px;
	background-image:url(/assets/images/leftcol/calls-to-action/pink/call-pink-bg.png);
}

#container #main-content #left-col .grey {
	height:96px;
	background-image:url(/assets/images/leftcol/calls-to-action/grey/call-bg.png);
}

/**** forms ****/

#container #main-content #left-col .call form {
	width:192px;
}

/*** navigation boxes ***/

#container #main-content #left-col .navbox {
	width:218px;
	float:left;
	clear:left;
	background-repeat:no-repeat;
	background-position:top left;
	padding:0;
	margin:0 0 5px 0;
}

#container #main-content #left-col .navbox .inner {
	width:192px;
	padding:10px 13px 0 13px;
}

#container #main-content #left-col .pinkbox {
	background-image:url(/assets/images/leftcol/calls-to-action/pink/top-bg.png);
}

#container #main-content #left-col .greybox {
	background-image:url(/assets/images/leftcol/calls-to-action/grey/top-bg.png);
}

#container #main-content #left-col .navbox .bottom {
	background-repeat:no-repeat;
	background-position:top left;
	width:218px;
	float:left;
	clear:both;
}

#container #main-content #left-col .pinkbox .bottom {
	background-image:url(/assets/images/leftcol/calls-to-action/pink/bottom-curve.png);
	height:11px;
	overflow:hidden;
}

#container #main-content #left-col .greybox .bottom {
	background-image:url(/assets/images/leftcol/calls-to-action/grey/bottom-bg.png);
	height:6px;
	overflow:hidden;
}

/** rightcol **/

/*** features ***/

#container #main-content #right-col #features {
	width:727px;
	float:left;
	clear:both;
	margin:0 0 5px 0;
}

#container #main-content #right-col #features #main-event {
	background-image:url(/assets/images/rightcol/features/home/main-event.png);
	background-position:top left;
	background-repeat:no-repeat;
	padding:7px 10px;
	height:52px;
	width:408px;
	margin:-3px 0 0 0;
	position:relative;
}

/**** home page features ****/

#container #main-content #right-col .home-features .featured {
	padding:10px 15px;
	float:left;
	height:284px;
}

/***** events calendar *****/

#container #main-content #right-col .home-features #events-calendar {
	background-image:url(/assets/images/rightcol/features/home/featured-bg.png);
	background-repeat:repeat-x;
	background-position:top left;
	width:427px;
	margin:0 0 0 0;

}

#container #main-content #right-col .home-features #events-calendar .feature-elements {
	float:left;
	margin:10px 0 0 0;
}

#container #main-content #right-col .home-features #events-calendar #calendar {
	width:201px;
	height:160px;
	float:left;
}

#container #main-content #right-col .home-features #events-calendar .feature-image {
	width:222px;
	height:148px;
	float:right;
	display:inline;
	margin:0 0 0 0;
}

#container #main-content #right-col .home-features #vouchers {
	background-image:url(/assets/images/rightcol/features/home/featured-bg.png);
	background-repeat:repeat-x;
	background-position:top left;
	float:right;
}

#container #main-content #right-col .home-features #vouchers .featured-image {
	width:236px;
	display:block;
	margin:-3px 0 0 0;
	position:relative;
}

#container #main-content #right-col .home-features #vouchers li a {
	width:100%;
}

#container #main-content #right-col .home-features #vouchers li p {
	width:100%;
}

/*** text area ***/

#container #main-content #right-col #text-area {
	width:695px;
	padding:16px;
	float:left;
	clear:both;
}

#container #main-content #right-col #internal-text-area {
	width:712px;
	padding:0 0 0 15px;
	float:left;
	clear:both;
	overflow:hidden;
}

/**** breadcrumb ****/

#container #main-content #right-col #breadcrumb {
	width:695px;
	margin:0 0 20px 0;
}

/**** tab area ****/

#container #main-content #right-col #tab-area {
	width:712px;
}

#container #main-content #right-col #tab-area .tab-content {
	width:712px;
	padding:0 0 20px 0;
}

#container #main-content #right-col #tab-area .tab-content .search {
	width:682px;
	background-image:url(/assets/images/rightcol/features/home/featured-bg.png);
	background-repeat:repeat-x;
	background-position:top left;
	padding:15px;
	float:left;
	clear:both;
}

#container #main-content #right-col #tab-area .tab-content .search .search-form {
	/*width:440px; put back when popular search is applied */
	width:682px;
	float:left;
}

#container #main-content #right-col #tab-area .tab-content .search .search-form .rad {
	width: 20px;
	background: none;
	border: none;
}

#container #main-content #right-col #tab-area .tab-content .search .popular {
	width:220px;
	float:right;
}

#container #main-content #right-col .paging {
	width:712px;
	clear:both;
	margin:10px 0;
	float:left;
	padding:5px 0;
}

/**** event list ****/

#container #main-content #right-col #tab-area .tab-content .event-list {
	width:712px;
	float:left;
	clear:both;
	margin:0 0 10px 0;
	border-top:1px solid #ddd;
}

#container #main-content #right-col #tab-area .tab-content ul.question-list {
	width:712px;
	margin:0 0 10px 0;
	border-top:1px solid #ddd;
	float:left;
	clear:left;
}

/**** faces ****/

#container #main-content #right-col #tab-area .tab-content .face-list {
	width:712px;
	float:left;
	clear:both;
	margin:0 0 10px 0;
}

.face-popup {
	width:425px;
	background-color:#f2f2f2;
	border:4px solid #444444;
	float:left;
}

.face-popup p.title {
	width:405px;
	margin:10px 10px 0 10px;
	border-bottom:1px solid #999;
	font-size:2em;
	font-weight:normal;
	position:relative;
	padding:5px 0 10px 0 !important;
}

.face-popup .leftcol {
	float:left;
	width:183px;
	height:175px;
	padding:10px;
}

.face-popup .rightcol {
	float:left;
	width:202px;
	height:175px;
	padding:10px 10px 10px 0;
}

/**** profile page ****/

#container #main-content #right-col #internal-text-area #two-col {
	width:712px;
	float:left;
	clear:both;
	margin:0 0 10px 0;
}

#container #main-content #right-col #internal-text-area #two-col .internal-left {
	width:440px;
	float:left;
	margin:0 0 10px 0;
}

#container #main-content #right-col #internal-text-area #two-col .internal-right {
	width:260px;
	float:right;
	margin:0 0 10px 0;
}

#container #main-content #right-col #internal-text-area #two-col .profile-square {
	float:left;
	margin:0 0 10px 0;
	background-color:#eee;
	padding:10px;
	overflow:hidden;
	position:relative;
}

#container #main-content #right-col #internal-text-area #two-col #groups {
	padding:10px;
}

#container #main-content #right-col #internal-text-area #two-col #latest-faces {
	padding:10px 4px 10px 10px;
	width:246px;
}

#container #main-content #right-col #internal-text-area #two-col #latest-places {
	padding:10px 5px 10px 10px;
	width:246px;
}

#container #main-content #right-col #internal-text-area #two-col #my-details {
	background-color:#f8eff3;
}

#container #main-content #right-col #internal-text-area #two-col .internal-left .profile-square {
	width:420px;
}

#container #main-content #right-col #internal-text-area #two-col .internal-right .profile-square {
	width:240px;
}

#container #main-content #right-col #internal-text-area #two-col .internal-left #group-nav {
	width:440px;
	margin:-10px 0 10px 0;
	position:relative;
	padding:0;
	background-color:#999;
	border-top:1px solid #777;
	float:left;
}

#container #main-content #right-col #internal-text-area #two-col .internal-left #group-comments {
	width:440px;
	margin:0 0 10px 0;
	position:relative;
	padding:0;
	float:left;
	padding:10px 0 0 0;
	border-top:1px dotted #d10264;
}

/**** message area ****/

#container #main-content #right-col #internal-text-area #two-col .profile-square .message {
	margin:0 0 0 0;
	display:block;
	width:420px;
	float:left;
}

#container #main-content #right-col #internal-text-area #two-col .profile-square .message .image-box {
	width:82px;
	float:left;
	margin:0 10px 0 0;
	text-align:center;
	display:inline;
}

#container #main-content #right-col #internal-text-area #two-col .profile-square .message .message-text {
	width:320px;
	float:left;
	margin:0 0 0 0;
}	

/***** send message *****/

#container #main-content #right-col #internal-text-area #two-col #send-message form {
	width:420px;
	float:left;
	display:block;
}

#container #main-content #right-col #internal-text-area #two-col #send-message form dl {
	width:420px;
	display:block;
}

#container #main-content #right-col #internal-text-area #two-col #send-message form dl dt {
	width:82px;
	display:inline;
	float:left;
	clear:both;
	margin:0 10px 7px 0;
}

#container #main-content #right-col #internal-text-area #two-col #send-message form dl dd {
	width:328px;
	float:right;
	margin:0;
}

/**** main messages page ****/

#container #main-content #right-col #internal-text-area .grey-box {
	width:692px;
	float:left;
	margin:10px 0 10px 0;
	background-color:#eee;
	padding:10px;
	overflow:hidden;
}

#container #main-content #right-col #internal-text-area .admin-grey-box {
	width:692px;
	float:left;
	margin:0 0 25px 0;
	background-color:#eee;
	padding:10px;
	overflow:hidden;
}

#container #main-content #right-col #internal-text-area .grey-box ul.message-list {
	width:692px;
}

#container #main-content #right-col #internal-text-area .grey-box ul.message-list li {
	width:692px;
}

#container #main-content #right-col #internal-text-area .grey-box ul.message-list li p.date {
	width:100px;
}

#container #main-content #right-col #internal-text-area .grey-box ul.message-list li ul {
	width:592px;
}

#container #main-content #right-col #internal-text-area .grey-box ul.message-list li ul li {
	width:582px;
}

/**** individual message page ****/

#container #main-content #right-col #internal-text-area #individual-message {
	width:712px;
	float:left;
	margin:10px 0 10px 0;
	overflow:hidden;
}

#container #main-content #right-col #internal-text-area #individual-message #sender-box {
	width:144px;
	padding:10px;
	background-color:#eee;
	float:right;
}

#container #main-content #right-col #internal-text-area #individual-message #message-content {
	width:518px;
	padding:10px;
	background-color:#eee;
	float:left;
}

#container #main-content #right-col #internal-text-area #individual-message #message-content #reply-to {
	width:518px;
	margin:30px 0 0 0;
	padding:20px 0 0 0;
	border-top:1px solid #ccc;
}

/**** contact us page ****/

#container #main-content #right-col #internal-text-area .grey-box dl.zend_form {
	width:692px;
	overflow:hidden;
	margin:10px 0 10px 0;
}

/**** add voucher page ****/

#container #main-content #right-col #internal-text-area #summary-box {
	float:right;
	padding:10px;
	width:138px;
	background-color:#f2f2f2;
}

/**** admin area ****/

ul.internal-tab {
	margin:10px 0 10px 0;
	float:left;
}
