/************* colour guide *************
dark = 	#4c453e
pink = 	#ff78ad
tan =	#cec2b8
darker grey = #e1e0e0
*****************************************/

img,
div,
h1,
h2,
h3,
p,
a {
	behavior: url(/css/iepngfix/iepngfix.htc)
}

body {
	font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
	font-size: 74%;
	color: #4c453e;
}

body {
	margin: 0px;
	padding:0px;
	background: #f5f5f5;
}

html,
body {
	height: 100%;
}

.wrapper {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -66px;	/*background-image: url(images/watermarklogo.png);
	background-repeat: no-repeat;
	background-position: left bottom;*/
}

#footer,
.push {
	height: 66px;
	overflow:hidden;
	clear:both;
}


/*********** blueprint overrides ***********/
.container {
	width: 750px;
	position: relative;
}
div.colborder {border-right-color: #e1e0e0;}

th {background:inherit;}



/*********** layout styles ***********/
#main-content {
	background-image: url(images/header-bg.gif);
	background-repeat: repeat-x;
	background-position: center top;
	padding-top: 30px;
}


/*********** header ***********/
#header {
	margin-bottom: 0px;
	color:#000;
	background-color: #4c453e;
	position:relative;
	overflow:hidden;
}

#header h1 {
	margin:0px;
	overflow:hidden;
}

#header h1 a {
	display: block;
	text-indent: -99999px;
	background: url(images/clever-girl-logo-header.png) no-repeat center center;
	height: 150px;
	width:165px;
	position:absolute;
	top:10px;
	left:0px;
}


#loginarea {
	width: 100%;
	border-bottom : 1px solid #7A6250;
	background-color: #6A5D52;
	z-index:1000;
	overflow:hidden;
	color: #f5f5f5;
}

 

#loginbuttons {
	width:100px;
	height: 50px;
	position: absolute;
	top:0px;
	right: 0px;
}
#loginbuttons a {
	display: block;
	float: right;
	line-height: 20px;
	text-align: center;
	width: 60px;
	color:#cec2b8;
	text-decoration: none;
	background: url(images/login_bg.gif) no-repeat center top;
}



/*********** main navigation ***********/
ul#nav-main {
	overflow: hidden;
	float:right;
	margin:0px;
}

ul#nav-main li {
	position: relative;
	float:left;
	overflow:visible;
	margin: 144px 0px 0px;
	list-style-type: none;
}

ul#nav-main li a {
	display: block;
	float: left;
	margin: 0px 0px 0px 3px;
	padding:0px 6px;
	background-color:#6A5D52;
	color:#cec2b8;
	line-height: 2em;
	text-decoration: none;
	border-top: 1px solid #7A6250;
	border-right: 1px solid #7A6250;
	border-left: 1px solid #7A6250;
	border-bottom: 0px none #7A6250;
	overflow: visible;
	text-transform:capitalize;
}
ul#nav-main li span {
	/*background: #f5f5f5;*/
	position: absolute;
	width: 200px;
	color:#cec2b8;
	top: -80px;
	left: -0px;
	text-align: left;
	z-index: 2;
	display: none;/**/
	line-height: 1.3em;
}

ul#nav-main li a.active {
	color:#fff;
	background-color: #ff78ad;
	border-color: #fff;
}

ul#nav-main li a:hover,
ul#nav-main li a.active:hover {
	color:#fff;
	background-color: #cec2b8;
	border-color: #fff;
}



/*ul li {
	margin: 100px auto;
	padding: 0;
	list-style: none;
	position: relative;
	float:left;
	overflow:visible;
}*/

/*ul li a {
	display: block;
	float:left;
	margin: 0px 5px 0px 0px;
	position: relative;
	padding: 0px 15px;
	line-height: 2.2em;
	background-color:#CCC;
}*/

/*ul li span {
	background: #f5f5f5;
	position: absolute;
	width: 300px;
	top: -40px;
	left: -0px;
	text-align: left;
	z-index: 2;
	display: none;
}*/



/*********** blog styles ***********/

.blog a {
	display: block;
	float: left;
	padding: 5px;
	margin: 0px 10px 10px 0px;
	background-color: #fff;
	border: 1px solid #ccc;
	text-align: left;
}

.blog a:hover {
	border-color: #F00;
}

.blog img {
	height:100px !important;
	width: auto !important;
	/*float: left !important;*/
	margin: 0px 0px !important;
	text-align: left !important;
}

.blog span {
	font-family:inherit !important;
}

div.blogger-post-footer {display:none;}



/*********** footer ***********/
#footer {
	background-color:#4c453e;
	background-image: url(images/footer-bg.gif);
	background-repeat: repeat-x;
	background-position: center top;
}
#footer p {
	line-height: 36px;
	margin:30px 20px 0;
}
#footer p, #footer a {
	color:#cec2b8;
	text-decoration:none;
}
#footer a:hover {
	text-decoration: underline;
}
#footer p.foot-left {
	float:left;
}
#footer p.foot-right {
	float:right;
}



/*********** font styles ***********/
h2,
h3,
h4,
h5,
h6,
p,
ul {
	line-height: 1.8em;
	margin: 0px 0px 1.8em;
	font-weight: normal;
	padding:0;
	list-style: none;
}

h2 {
	font-size: 3em;
	margin-bottom: 0.2em;
	line-height: 1em;
	font-weight: bold;
	border-bottom: 1px solid #e1e0e0;
}

h2,
h4,
a,
#footer em,
#footer strong,
form legend {
	color: #ff78ad;
}

h3 {
	color: #4c453e;
	margin-bottom: 0.8em;
	font-size: 1.4em;
	font-weight: bold;
	line-height: 1.2em;
}


h4,
h5 {
	margin-bottom: 0px;
	font-size: 1.2em;
	font-weight: bold;
}

h5 {
	font-weight: normal;
	color: #fff;
	font-size: 1em;
}

p {
}

p.warning {
	border: 1px solid #EBC9C9;
	padding: 8px 15px;
	background: #fee;
	color: #900;
}

p.boxed,
form fieldset,
.caption {
	border: 1px solid #e0e0e0;
	background: #f5f5f5;
	padding: 8px 15px;
}

p.read-more {
	margin-top: -1.8em;
	text-align:right;
}

/*.revealonload {display:none;}*/

.completedtask {
	background-color:#FF9;
	border:1px solid #fd0;
	padding: 5px 10px;
	margin-bottom: 5px;
}

p.thumbnailbox {
	border:1px solid #ccc;
	background-color:#fff;
	padding:5px;
	float:left;
	margin:0 10px 10px 0;
}
p.thumbnailbox img {width:60px; height:60px;
	cursor:pointer;}
p.thumbnailbox label {cursor:pointer;
}

form p.selected {
	border-color:#FC6;
	background-color:#FFC;
}

a {
}

a:hover {
	color: #CE3C6E;
}

a.bloglink {
	display: block;
	line-height: 26px;
	padding: 0px 0px 0px 32px;
	background: url(../images/blog_icon.jpg) no-repeat left center;
	text-decoration: none;
	font-weight: bold;
}

p img.left {
	float:left;
	margin: 5px 15px 5px 0px;
	padding: 0px;
}

p img.right {
	float:right;
	margin: 5px 0px 5px 15px;
	padding: 0px;
}


ul.points {
}
ul.points li {
	padding: 0px 0px 0px 15px;
	list-style-type: none;
	background-image: url(images/ul-pink-point.gif);
	background-repeat: no-repeat;
	background-position: 2px 7px;
}



/*.thumbnail-frame,
.thumbnail-frame-ido {
	width: 390px;
	overflow:hidden;
	background: url(../gallery/frames/corporate-02.gif) no-repeat left bottom;
}


ul.gallery-thumbnails {
	overflow: hidden;
	background: url(../gallery/frames/corporate.gif) no-repeat left top;
	padding: 35px 0px 32px 35px;
	margin: 0px;
}

.thumbnail-frame-ido {
	background: url(../gallery/frames/ido-02.gif) no-repeat left bottom;
}
.thumbnail-frame-ido ul.gallery-thumbnails {
	background: url(../gallery/frames/ido.gif) no-repeat left top;
}

.thumbnail-frame-goodlife {
	background: url(../gallery/frames/goodlife-02.gif) no-repeat left bottom;
}
.thumbnail-frame-goodlife ul.gallery-thumbnails {
	background: url(../gallery/frames/goodlife.gif) no-repeat left top;
}*/


.thumbnail-frame,
.thumbnail-frame-ido,
.thumbnail-frame-goodlife,
.thumbnail-frame-littlepeople {
	width: 392px;
	height:392px;
	overflow:hidden;
}


ul.gallery-thumbnails {
	overflow: hidden;
	padding: 35px 0px 32px 35px;
	margin: 0px;
	background: url(../gallery/frames/generic.jpg) no-repeat left top;
	height:400px;
}


/*.thumbnail-frame-ido ul.gallery-thumbnails {
	background: url(../gallery/frames/ido.jpg) no-repeat left top;
}

.thumbnail-frame-goodlife ul.gallery-thumbnails {
	background: url(../gallery/frames/goodlife.jpg) no-repeat left top;
}

.thumbnail-frame-littlepeople ul.gallery-thumbnails {
	background: url(../gallery/frames/littlepeople.jpg) no-repeat left top;
}*/



ul.gallery-thumbnails li {
	display:inline;
}

ul.gallery-thumbnails li a {
	display: block;
	float: left;
	background-color:#fff;
	margin: 0px 3px 3px 0px;
	padding: 0px;
	border: 1px solid #b6a798;
	/*border-right: 1px solid #c1c0c0;
	border-bottom: 1px solid #fff;
	border-left: 1px solid #919090;*/
}

ul.gallery-thumbnails li a.nopadding {
	padding: 0px;
}

ul.gallery-thumbnails li a img {
	width:60px;
	height:60px;
}

ul.gallery-thumbnails li a:hover,
ul.gallery-thumbnails li a.nopadding:hover {
	border-color: #ff78ad;
}


ul.sortable {
	overflow:hidden;
	min-height: 60px;
	min-width: 60px;
	padding: 5px;
	background-color: #fff;
	border: 1px solid #ddd;
	margin-bottom: 20px;
	clear:both;
}

body ul.sortable li {
	margin: 2px;
	float: left;
	padding:0px;
	display:inline;
	border:1px solid #ddd;
}
ul.sortable li.placeholder {
	background-color:#FFC2D9;
	border-color:#ff78ad;
}
ul.sortable li img {
	width: 60px;
	height: 60px;
	margin:0px;
	padding:0px;
	border:none;
	outline:none;
}


/************ =form= ************/

img.captcha {
	 width: 310px;
	 height: 65px;
	 background-color: #fff;
	 border:1px solid #aaa;
	 margin: 5px 0px;
}

form {
}

form fieldset {
	padding-bottom: 0px;
	/*border: 1px solid #ccc;*/
	background-color:#fafafa;
}

form legend {
	background-color: #fff;
	padding: 0px 10px;
	border: 1px solid #ccc;
}

form fieldset,
form legend {
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}

form p {
	margin:0 0 1.2em;
}

form label {
	display:block;
	color: #333;
	line-height:1.2em;
}

form em {
	font-style: normal;
	font-weight: bold;
	color: #F00;
}

form input.button-marging-right {
	margin-right:20px;
}

form input.button-marging-left {
	margin-left:20px;
}

form input.text-long,
form input.text-medium,
form input.text-short,
form textarea {
	border: 1px solid #ccc;
	width: 300px;
	outline: none;
	padding:.8em 0.5em;
	color:#999;
	background-color:#fff;
	margin: 0px 0px 5px;
}

form input.disabled {
	background-color: #f0f0f0;
	border-color: #ddd;
}

form input.text-medium {
	width: 160px;
}

form input.text-short {
	width: 80px;
}

form textarea {
	height: 102px;
}

form input.text-long:focus,
form input.text-long.focus,
form input.text-medium:focus,
form input.text-medium.focus,
form input.text-short:focus,
form input.text-short.focus,
form textarea:focus,
form textarea.focus {
	background-color: #FFEFF5;
	border: 1px solid #ff78ad;
	color: #111;
}

form#login {
	padding: 0px 0px;
	margin: 0px 0px;
}

form#login p {
	float: left;
	margin: 10px 20px 10px 0;
	overflow: auto;
}
form#login p label {
	color: #cec2b8;
	margin-bottom:0px;
}
form#login p input {
	margin-bottom:0px;
}