@charset "utf-8";
/* CSS Document */

@import 'friend.css';
@import 'layout.css';
@import 'lists.css';


hmtl, body, h1, h2, h3 {
	margin: 0;
	padding: 0;
}
body {
	font-size: 62.5%;
	background: #fff url('../images/design/rutor_sidan_morka.png') repeat-y top left;
}


p, form, dt, dd, table {
	font-family: Georgia, Times New Roman;
	font-size: 1.4em;
	color: #336;
	line-height: 1.35em;
}
p {
	margin: 6px 0;
}
#content p {
	clear: left;
	margin-left: 60px;
	width: 600px;
}
#right p {
	margin-left: 0;
}
p#msg {
	font-size: 1.6em;
	background: #F99;
	font-weight: bold;
	padding: 0 4px;
	font-family: Courier New, Courier, serif;
	color: #000;
	width: 742px;
	margin-left: 0;
}
form p {
	font-size: 1em;
}
.moreInfo {
	border-bottom: 1px solid;
	background: #eee;
}
.moreInfo p {
	margin: 3px 10px;
}

h1 {
	font-family: Georgia, Times New Roman;
	font-size: 4em;
	letter-spacing: 0.25em;
	color: #336;
	clear: left;
}

h2 {
	font-family: Georgia, Times New Roman;
	font-size: 2.5em;
	letter-spacing: 0.15em;
	color: #336;
	clear: left;
}

h3 {
	font-family: Georgia, Times New Roman;
	font-size: 1.65em;
	letter-spacing: 0.1em;
	color: #336;
	margin: 15px 0 1px ;
	clear: left;
}

h4 {
	font-family: Georgia, Times New Roman;
	font-size: 1.35em;
	letter-spacing: 0.05em;
	color: #336;
	margin: 15px 0 4px ;
	clear: left;
}
#content h3, #content h4 {
	margin-left: 60px;
}

a, a:visited, a:active {
	font-size: 0.8em;
	font-family: Verdana, Geneva, sans-serif;
	font-weight: bold;
	color: #858;
}
a:hover {
	color: #c69;
}
a.activeLink, a.activeLink:visited, a.activeLink:active {
	color: #09C;
}
a.activeLink:hover {
	color: #3cf;
}



label, input, select, textarea {
	margin: 3px 0;
}

.login_form input {
	float: none;
}

p.showHideAll {
	width: 443px;
	text-align: right;
	margin-bottom: 2px;
}
.listing {
	width: 450px;
	border-collapse: collapse;
	margin: 0px 0 20px;
	border-bottom: 1px solid;
	margin-left: 60px;
}
form p.priority, .listing tr.priority td, .listing tr.outdatedLists td {
	font-size: 1.3em;
	color: #858;
	border-bottom: 2px solid;	
}
.listing tr.priority td, .listing tr.outdatedLists td {
	height: 2.3em;
	vertical-align: bottom;
	padding-bottom: 4px;
	letter-spacing: 0.1em;
}
.listing tr.firstRow td {
	border-top-width: 0px;
	height: 1em;
	margin-top: 0px;
}
.listing td {
	border-top: 1px solid;
	
}
.listing, .listing tr.priority td, .listing tr.outdatedLists td, .listing td, form p.priority {
	border-color: #7cc;
}
.listing td.name {
	width: 290px;
	padding-left: 6px;
	font-weight: bold;
}
.listing td.price {
	text-align: right;
	padding-right: 8px;
}
.listing td.showInfo {
	width: 63px;
	padding-right: 6px;
	text-align: right;
}
.listing td.showInfo a, p.showHideAll a {
	cursor: pointer;
	text-decoration: underline;
}
.listing td.showInfo a:hover, p.showHideAll a:hover {
	color: #c69;
}
.listing .leftBlock {
	width: 4px;
}
.listing .iPicked {
	background: #ffe6e6;
}
.listing .youPicked {
	background: #e6e6e6;
}
.listing .notPicked {
	background: #d5d5ff;
}
.listing .list {
	background: #DDFFC3;
}
.listing .myList {
	background: #E5F0E5;
}
.listing .showHideInfo {
	display: table-row;
}
.listing .showHideInfo td {
	vertical-align: top;
	border-top-width: 0;
}
.listing .link, .listing .pickItem {
	height: 1.8em;
}
.listing .priorityLink {
	padding: 0 6px;
}
.listing .floatLeft {
	float: left;
}
.listing .priorityLink .link, .listing .priorityLink .noInfo {
	float: right;
}
.listing .noInfo {
	font-size: 0.8em;
	color: #666;
}
.listing .pickItem {
	padding-right: 6px;
	text-align: right;
}
.listing .description {
	padding: 4px 6px;
	vertical-align: top;
}

.listing .listTitle {
	font-weight: bold;
	padding-left: 5px;
	width: 300px;
}
.listing .showListLink {
	width: 80px;
	text-align: right;
	padding-right: 5px;
}
.listing .itemsInList {
	width: 140px;
	display: block;
	float: left;
}
.listing .listOptions {
	text-align: right;
	padding-right: 5px;
	width: 63px;
}
.listing .date {
	padding-left: 5px;
}


form p.priority {
	float: left;
	clear: both;
	width: 400px;
}

form.styleForm {
	width: 431px;
	margin-left: 60px;
}
#right form.styleForm {
	margin-left: 0px;
}
form.styleForm label {
	display: block;
	clear: both;
	position: relative;
	width: 430px;
	margin: 7px 0;
}
form.styleForm input, form.styleForm select {
	/*float: left;*/
}

form.styleForm input[type='text'], form.styleForm input[type='password'], form.styleForm textarea, form.styleForm select {
	width: 250px;
	position: absolute;
	top: 0;
	right: 0;
	margin: 0;
}
form.styleForm select {
	width: 256px;
}
form.styleForm label.textarea {
	height: 100px;
}
form.styleForm textarea {
	width: 250px;
	height: 90px;
}
form.styleForm input[type='radio'] {
	margin: 3px 10px 0 0;
}

#content form.styleForm p.checkboxTitle {
	float: left;
	margin-top: 2px;
	margin-left: 0;
	width: 150px;
}

form.styleForm label.checkbox {
	width: 250px;
	float: right;
	clear: right;
	margin: 2px 4px;
}

form.styleForm input[type='checkbox'] {
	margin: 3px 10px 0 0;
}
form.styleForm input.inputDate {
	position: absolute;
	top: 0;
	right: 125px;
	width: 125px;
}
form.styleForm span.inputDate {
	position: absolute;
	top: 0;
	right: 20px;
}

form.styleForm input[type='submit'] {
	display: block;
	float: right;
	clear: both;
}


form.pickItems {
	width: 380px;
}

form.pickItems label {
	float: left;
	width: 350px;
	margin-left: 60px;
}

form.pickItems input[type='submit'] {
	display: block;
	clear: both;
	margin-left: 500px;
}

form input[type='checkbox'] {
	float: left;
	clear: left;
	width: 20px;
	margin: 3px 7px 0 0;
}

form.sendList {
	margin-left: 60px;
	width: 460px;
}
form.sendList label {
	display: block;
}
form.sendList textarea {
	width: 450px;
	height: 170px;
}
form.sendList input[type='submit'] {
	display: block;
	clear: both;
	float: right;
	margin-right: 10px;
}

input.wrong {
	background: #F99;
}

span.infoNeeded  {
	color: #C03;
	margin: 0 4px;
}


ul.listsWithItemIn {
	font-size: 1.4em;
	list-style-type: none;
	margin: 5px 0 10px 60px;
	padding-left: 20px;
}


#cont_left {
	float: left;
	width: 360px;
}

#intro {
	float: left;
	border-top: 0px solid #F00;
	border-bottom: 0px solid #F00;
	width: 100%;
}

#left {
	float: left;
	clear: left;
	border-top: 0px solid  #00F;
	border-bottom: 0px solid  #00F;
	width: 100%;
	margin-top: 20px;
}


#right {
	float: right;
	border-top: 0px solid #0F0;
	border-bottom: 0px solid #0F0;
	width: 500px;
	margin-top: 40px;
}

#content #messagePreview {
	border: 1px solid #ddd;
	background: #f5f5f5;
	margin: 20px 0 20px 60px;
	width: 500px;
}
#content #messagePreview h3{
	margin: 5px 0 10px 20px;
}
#content #messagePreview p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.2em;
	margin-left: 20px;
	width: 460px;
}
#content #messagePreview p a {
	font-size: 0.9em;
}

#content #terms p {
	width: 500px;
	margin-bottom: 15px;
	line-height: 1.5em;
}

#content p.faqQuestion {
	border: 1px solid #ddd;
	background: #f5f5f5;
	margin: 20px 0 0px 60px;
	padding: 5px 10px;
}
#content div.faqAnswer {
	border: 1px solid #ddd;
	border-top-width: 0px;
	margin: 0px 0 40px 90px;
	width: 570px;
	padding: 5px 10px;
}
#content div.faqAnswer p {
	margin-left: 0;
	width: 570px;
}

form.styleForm label.cha {
	background: #ddd;
	border-bottom: 1px solid #ddd;
	width: 250px;
	margin-left: 177px;
}
form.styleForm label.cha img {
	vertical-align: top;
	margin: 5px 10px 5px 5px;
}
form.styleForm label.cha input {
	width: 122px;
	top: 22px;
	right: 5px;
}

dl.options dd.current a {
	color: #09C;
}
dl.options dd.current a:hover {
	color: #3cf;
}

span.notice {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 0.9em;
	color: #858;
}
img.left {
	float: left;
	margin-right: 40px;
}
.clear {
	float: left;
	clear: both;
}
