html {
	height: 97%;
	background-color: #bfebff;
}


body {
	/*
	font-size: 62.5%;
	font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
	*/
	background-image: url(../images/background_women_eyes.jpg);
	background-repeat: no-repeat;
	color: #0066cc;
	padding: 10px;
	margin: 0;
	font-family: Times New Roman, Times, serif;
}

h3 {
	font-family: Georgia, Times New Roman, Times, serif;
}

p {
	text-align: justify;
	text-indent: 20pt;
	margin: 2px 1px 2px 1px;
}

pre.poems {
	/*
	font-size: x-small;
	font-family: Georgia, Times New Roman, Times, serif;
	*/
	text-align: left;
}

ul li {
	list-style-image: url(../images/bullet.gif);
}
/*
li.bullet {
	list-style-image: url(../images/bullet.gif);
	/* list-style-image: url(../images/bullets/heart.gif); */
}
*/

img {
	border-top-width: 0;
	border-left-width: 0;
	border-bottom-width: 0;
	border-right-width: 0;
}

/* No focus border in FF. */
a:focus {
	-moz-outline: none !important;
	-moz-outline-offset: 0 !important;
	-moz-outline-radius: 0 !important;
}

img.fade, img.faded, a.fade {
	/* Parsed by IE but ignored by FF. */
	// filter: alpha(opacity=30);
	/*
	-moz-opacity: 0.3;
	opacity: .30;
	*/
}

a {
	color: #ffffff;
	text-decoration: none;
	border-bottom: 1px dashed #0086cc;
}

a:link {
	color: #0066cc;
	border-bottom: 1px dashed #0086cc;
}

a:hover {
	color: #0086cc;
	border-bottom: 1px solid #0086cc;
}

a:visited {
	color: #0086cc;
	border-bottom: 1px dashed #0086cc;
}

a:active {
	color: #0086cc;
	text-decoration: none;
}

a:link.selected {
	color: #0066cc;
}

a img {
	border: 0;
}
/*
a.poetryTitle {
	font-family: Georgia, Times New Roman, Times, serif;
	font-size: x-small;
}*/

.copyright {
	font-size: xx-small;
	font-style: italic;
	text-align: center;
}

.notice {
	font-size: x-small;
	font-weight: bold;
	color: #ffffff;
}

.errorMessage {
	font-weight: bold;
	color: #ffffff;
}

.top_menu {
	color: #ffffff;
	font-weight: bold;
}

input {
	background-color: #ffffff;
	font-family: verdana, arial, helvetica, sans-serif;
	border-right: #47afe0 1px solid;
	border-top: #47afe0 1px solid;
	font-weight: normal;
	font-size: 12px;
	border-left: #47afe0 1px solid; color: #4c73b5;
	border-bottom: #47afe0 1px solid;
}

input.button {
	color: #ffffff;
	background-color: #4c73b5;
	font-weight: bold;
	font-size: 12px;
	font-family: verdana, arial, helvetica, sans-serif;
	border-top: #ffffff 1px solid;
	border-left: #ffffff 1px solid;
	border-bottom: #47afe0 1px solid;
	border-right: #47afe0 1px solid;
}

input.newinput {
	border-right: #47afe0 1px solid;
	border-top: #47afe0 1px solid;
	font-weight: normal;
	font-size: 10px;
	background: #ffffff; border-left: #47afe0 1px solid;
	color: #003896; border-bottom: #47afe0 1px solid;
	font-family: verdana, arial, helvetica, monospace;
}

input.radiobutton {
	border-right: #ffffff 0 solid;
	border-top: #ffffff 0 solid; font-weight: normal;
	border-left: #ffffff 0 solid;
	width: 14px;
	color: #cbe9f6;
	border-bottom: #ffffff 0 solid;
	background-color: #cbe9f6
}

input.checkbox {
	border-right: #ffffff 0 solid;
	border-top: #ffffff 0 solid;
	font-weight: normal;
	border-left: #ffffff 0 solid;
	width: 14px;
	color: #cbe9f6;
	border-bottom: #ffffff 0 solid;
	background-color: #cbe9f6;
}

input.image {
	border-right: #ffffff 0 solid;
	border-top: #ffffff 0 solid;
	font-weight: normal;
	border-left: #ffffff 0 solid;
	color: #cbe9f6;
	border-bottom: #ffffff 0 solid;
	background-color: #cbe9f6;
}

input.buttonpercentage {
	border-right: #47afe0 1px solid;
	border-top: #47afe0 1px solid;
	font-weight: normal;
	font-size: 10px;
	border-left: #47afe0 1px solid; color: #4c73b5;
	border-bottom: #47afe0 1px solid;
	font-family: verdana, arial, helvetica, sans-serif;
	background-color: #ffffff;
}

textarea {
	border-right: #47afe0 1px solid;
	border-top: #47afe0 1px solid;
	font-weight: normal;
	font-size: 12px;
	border-left: #47afe0 1px solid;
	color: #4c73b5;
	border-bottom: #47afe0 1px solid;
	font-family: verdana, arial, helvetica, sans-serif;
	background-color: #ffffff;
}

td.small {
	color: #ffffff;
	background-color: #4c73b5;
	font-size: xx-small;
}

.small {
	font-size: 75%;
	font-family: verdana, arial, sans-serif;
}

.blueCornerLeft {
	background-image: url(../images/borders/blue_corner_left.gif); width: 8px; background-repeat: no-repeat; height: 8px;
}
.blueCornerRight {
	background-image: url(../images/borders/blue_corner_right.gif); width: 8px; background-repeat: no-repeat; height: 8px;
}
.blueTop {
	background-image: url(../images/borders/blue_top_bg.gif); background-repeat: repeat-x; height: 8px;
}
.blueHeader {
	font-weight: bold; background-image: url(../images/borders/blue_bg.gif); text-align: center; padding-bottom: 0; color: #ffffff; padding-top: 0; padding-right: 0; padding-left: 0;
}
.blueBgLeft {
	background-image: url(../images/borders/blue_left_bg.gif); width: 8px; background-repeat: repeat-y;
}
.blueBgRight {
	background-image: url(../images/borders/blue_right_bg.gif); width: 8px; background-repeat: repeat-y;
}
.blueHeaderBottomLeft {
	background-image: url(../images/borders/blue_header_corner_bottom_left.gif); width: 8px; background-repeat: no-repeat; height: 8px;
}
.blueHeaderBottom {
	background-image: url(../images/borders/blue_top_bottom_bg.gif); width: 8px; background-repeat: repeat-x; height: 8px;
}
.blueHeaderBottomRight {
	background-image: url(../images/borders/blue-header-corner-bottom-right.gif); width: 8px; background-repeat: no-repeat; height: 8px;
}
.blueLineLeft {
	background-image: url(../images/borders/blue_line_left.gif); width: 8px; background-repeat: repeat-y;
}
.blueLineRight {
	background-image: url(../images/borders/blue_line_right.gif); width: 8px; background-repeat: repeat-y;
}
.blueBottomLeft {
	background-image: url(../images/borders/blue_bottom_left.gif); width: 8px; background-repeat: no-repeat; height: 8px;
}
.blueBottomRight {
	background-image: url(../images/borders/blue_bottom_right.gif); width: 8px; background-repeat: no-repeat; height: 8px;
}
.blueBottomLine {
	background-image: url(../images/borders/blue_bottom_bg.gif); width: 8px; background-repeat: repeat-x; height: 8px;
}

ul.module {
	padding-right: 0; padding-left: 15px; padding-bottom: 3px; margin: 0 0 0 5px; padding-top: 0;
}

li.mapBullet {
	padding-right: 0; padding-left: 0; font-weight: bold; font-size: 13px; list-style-image: url(../images/borders/map_bullet.gif); padding-bottom: 0; margin: 15px 0 2px 5px; line-height: 16px; padding-top: 0;
}
li.classicBold {
	padding-right: 0; padding-left: 0; font-weight: bold; font-size: 11px; list-style-image: url(../images/borders/classic_bullet.gif); padding-bottom: 0; margin: 2px 0 2px 5px; line-height: 14px; padding-top: 0;
}

.listitem {
	font-weight: normal; font-size: 100%; color: #262626; line-height: 17px; font-family: verdana, tahoma, arial, helvetica, monospace;
}

.spacing {
	padding-right: 0; padding-left: 0; padding-bottom: 30px; line-height: 30px; padding-top: 30px;
}

/* General layout. */

/** Header. **/

.header {
	width: 99%;
	padding-bottom: 150px;
}

.header .proverb {
	float: right;
	width: 300px;
}

.header .proverb .title {
	color: #ffffff;
	font-weight: bold;
	text-align: center;
}

.header .proverb .text {
	font-style: italic;
	text-align: right;
}

/** Content **/

/*** TODO: avoid this content wrapping? ***/
.contentWrapper {
	width: 100%;
	text-align: center;
}

.contentWrapper a {
	border-bottom: 1px dashed #0066cc;
}

.contentWrapper a:visited {
	border-bottom: 1px dashed #0086cc;
}

.contentWrapper a:hover {
	border-bottom: 1px solid #0086cc;
}

.content {
	width: 800px;
	margin: 50px auto;
	padding: 10px;
	border: 1px dashed white;
	background-color: #d6f2ff;
}

.content .entrance {
	float: right;
	/*** or
	position: absolute;
	top: 20%;
	***/
	width: 100%;
	text-align: center;
}

.content .entrance .menu {
	width: 100%;
	margin-bottom: 10px;
}

.content .entrance span {
	display: block;
}

.content .quote {
	margin-top: 50px;
	font-style: italic;
	float: right;
}

.content .entrance .affilates {
	margin-top: 20px;
}

.transparent {
	border: 0;
	background-color: transparent;
}

/** Footer for index page is disabled. **/

/***
.footer {
	position: absolute;
	bottom: 10px;
}

.footer .conformance {
	position: absolute;
	text-align: center;
	bottom: 0;
	width: 100%;
}

.footer .conformance .xhtmlLogo, .footer .conformance .cssLogo, .footer .conformance .waiLogo {
	width: 66px;
	height: 20px;
}

.footer .poveredBy {
	right: 10px;
	text-align: right;
	float: right;
	padding-right: 10px;
	width: 100px;
}

.footer .poveredBy .freebsdLogo {
	width: 36px;
	height: 40px;
}

.footer .poveredBy .phpLogo {
	width: 88px;
	height: 32px;
}
***/

/** Footer for main pages. **/

.footer {
	width: 99%;
}

.footer * {
	font-size: 85%;
}

.footer .hr {
	float: left;
	display: block;
	width: 100%;
	height: 3px;
}

.footer .login, .footer .copyright, .footer .gotoTop {
	float: left;
}

.footer .gotoTop a, .footer .login a {
	border: 0;
}

.footer .copyright a {
	border-bottom: 1px dashed #0066cc;
}

.footer .copyright a:visited {
	border-bottom: 1px dashed #0086cc;
}

.footer .copyright a:hover {
	border-bottom: 1px solid #0066cc;
}

/*** Align footer elements. ***/

.footer .login {
	width: 10%;
	text-align: left;
}

.footer .copyright {
	width: 80%;
	text-align: center;
}

.footer .gotoTop {
	width: 10%;
	text-align: right;
}

/*** Set images dimensions. ***/

.footer .login img {
	width: 13px;
	height: 14px;
}

.footer .copyright img {
	width: 11px;
	height: 8px;
}


.footer .gotoTop img {
	width: 11px;
	height: 10px;
}

/** Main menu. **/

.menu {
	width: 100px;
}

.menu a img {
	display: block;
	margin: 2px;
}

.menu * {
	border: 0;
}

/* Common. */
/* TODO: move to separate css file. */

.hidden {
	 display: none;
}

.clearBoth {
	clear: both;
}

/** Headings **/

/*** Page heading. ***/
h1 {
	text-align: center;
}

h2 {
	text-align: left;
	margin-left: 20pt;
}

.undecoratedLink, .undecoratedLink:hover, .undecoratedLink:visited {
	text-decoration: none;
	border-bottom: 0;
}

.contentWrapper .undecoratedLink, .contentWrapper .undecoratedLink:hover, .contentWrapper .undecoratedLink:visited {
	text-decoration: none;
	border-bottom: 0;
}


/* Page specific classes. */
/* TODO: move each to its css file. */

/** Index page. **/

.skypeIcon {
	border: 0;
	width: 150px;
	height: 60px;
}

.openIdIcon {
	border: 0;
	width: 38px;
	height: 35px;
}

.linkedInIcon {
	border: 0;
	width: 160px;
	height: 33px;
}


.mainLogo img, .mainLogo {
	width: 90px;
	height: 40px;
	float: right;
}

.mainLogo, .mainLogo:hover {
	border: 0;
}


/** About page. **/

.about .photo {
	float: right;
	border: 1px dashed white;
	margin-left: 20px;
}


/** News page. **/
/*** TODO: use common style templates for Photo and News page. ***/

.news {
	width: 26em;
	margin: 0 auto;
}

.news .item, .news .item .date, .news .item .info {
	float: left;
	text-align: left;
}

.news .item .date {
	width: 6em;
}

.news .item .info {
	width: 20em;
	padding-bottom: 1px;
}

/** Photo page. **/
/*** TODO: use common style templates for Photo and News page. ***/

.photos {
	width: 30em;
	margin: 0 auto;
}

.photos .item, .photos .item .date, .photos .item .info {
	float: left;
	text-align: left;
}

.photos .item .icon {
	float: left;
	text-align: right;
}

.photos .item .date {
	width: 6em;
}

.photos .item .info {
	width: 20em;
	padding-bottom: 1px;
}

.photos .item .icon {
	width: 3em;
}

/** Poetry page. **/

.poetry h1 {
	float: left;
	width: 100%;
}

.poetry h1 .title {
	width: 330px;
	float: left;
}

.poetry h1 .ilustrations {
	width: 440px;
	float: right;
}

.poetry h1 .ilustrations .kissImage, .poetry h1 .ilustrations .roseImage {
	float: right;
	margin-left: 10px;
}

.poetry h1 .ilustrations .kissImage {
	width: 164px;
	height: 134px;
	border: 1px dashed white;
	background-color: #bfebff;
}

.poetry h1 .ilustrations .roseImage {
	width: 250px;
	height: 138px;
	border: 1px dashed white;
}

/*** Poetry menu links. ***/

.poetry .menu {
	margin: 10px auto;
	width: 36em;
}

.poetry .menu .column, .poetry .item, .poetry .item .icon, .poetry .item .info, .poetry .item .info * {
	float: left;
}

.poetry .menu .column, .poetry .item .info {
	text-align: left;
}

.poetry .item .icon {
	text-align: right;
}

.poetry .menu .column {
	width: 18em;
}

.poetry .item .icon {
	width: 2em;
}

.poetry .item .info {
	width: 15em;
}
/*
.poetry .item .info a {
	border-bottom: 1px dashed #0066cc;
}
*/
/*
.poetry .item .info a:hover {
	border-bottom: 1px solid #0066cc;
}
*/
/*** Separator between poetry links and selected poetry itself. ***/

.poetry .separator {
	width: 100%;
}

.poetry .separator * {
	float: left;
	margin: 0;
	padding: 0;
}

.poetry .separator .start {
	width: 5%;
	text-align: right;
}

.poetry .separator .body {
	width: 89%;
	background-image: url("/images/sep1_bg.gif");
	margin-left: -4px;
	margin-right: -4px;
}

.poetry .separator .end {
	width: 5%;
	text-align: left;
}

.poetry .separator .start img {
	width: 38px;
}

.poetry .separator .end img {
	width: 8px;
}

/*** Photo associated with poetry. ***/

.poetry .photo {
	width: 303px;
	height: 275px;
	float: right;
	border: 1px dashed white;
}

/** Guest Book page. **/

/*** New comment. ***/

.guestBook .newComment {
	width: 390px;
	margin: 20px auto;
}

.guestBook .newComment .userInfo, .guestBook .newComment .userInfo .label, .guestBook .newComment .userInfo .value {
	float: left;
}

.guestBook .newComment .userInfo {
	padding-top: 2px;
	width: 100%;
}

.guestBook .newComment .userInfo .label {
	width: 100px;
	text-align: right;
	font-weight: bold;
	margin-right: 10px;
}

.guestBook .newComment .userInfo .value, .guestBook .newComment .userInfo.parameter {
	width: 240px;
	text-align: left;
}

.guestBook .newComment .userInfo .value * {
	width: 100%;
}

.guestBook .newComment .userInfo.parameter {
	padding-left: 110px;
	width: 100%;
}

.guestBook .newComment .userInfo.parameter * {
	width: auto;
}

.guestBook .newComment .control {
	padding-top: 20px;
}

/*** Particular existing comment in guest book. ***/

.guestBook .comment {
	float: left;
	background-color: #bfebff;
	border: 1px dashed white;
	padding: 2px 10px;
}

.guestBook .comment .body{
	text-align: left;
}

.guestBook .comment .userInfo {
	float: left;
}

.guestBook .comment .userInfo .group1 {
	float: left;
}

.guestBook .comment .userInfo .group1 .name, .guestBook .comments .userInfo .group1 .icq {
	display: inline;
}

.guestBook .comment .userInfo .group2 {
	float: right;
}

.guestBook .comment .userInfo .webpage {
	/* border-bottom: 1px dashed #0066cc;*/
	padding-bottom: 1px;

}

.guestBook .comment .userInfo .group3 {
	float: right;
	width: 100%;
}

.guestBook .comment .userInfo .group3 .assess {
	float: left;
	text-align: right;
	width: 60%;
}

.guestBook .comment .userInfo .group3 .city {
	float: right;
	margin-right: 5px;
}

.guestBook .comment .userInfo .group3 .datetime {
	float: right;
}

/** Login page. **/

.login .form {
	width: 27em;
	margin: 0 auto;
}

.login .form form {
	float: left;
	padding-top: 20px;
}

.login .form .userInfo, .login .form .userInfo .label, .login .form .userInfo .value {
	float: left;
}

.login .form .userInfo {
	width: 100%;
	padding-top: 2px;
	text-align: left;
}

.login .form .userInfo .label {
	width: 6em;
}

.login .form .userInfo .value {
	width: 20em;
}

.login .form .userInfo .value * {
	width: 100%;
}

.login .form .control {
	padding: 20px 6em;
	width: 14em;
}

.login .form .control * {
	padding-left: 15px;
}

.login .form .control .registerLink {
	padding-top: 20px;
	display: block;
	border: 0;
}

.login .form .control .registerLink a {
	border: 0;
}

.login .form .control .registerLink a span {
	border-bottom: 1px dashed #0066cc;
	padding: 0;
}

.login .form .control .registerLink a:hover span {
	border-bottom: 1px solid #0066cc;
}

/** Register page. **/

.registration .form {
	width: 20em;
	margin: 0 auto;
}

.registration .form .userInfo, .registration .form .userInfo .label, .registration .form .userInfo .value {
	float: left;
}

.registration .form .userInfo {
	width: 100%;
	padding-top: 2px;
	text-align: left;
}

.registration .form .userInfo .label {
	width: 8em;
}

.registration .form .userInfo .value {
	width: 12em;
}

.registration .form .userInfo .value * {
	width: 100%;
}

.registration .form .control {
	padding: 20px 0 20px 8em;
}
