/* Site design by mediasuni.fi */
/* Background pattern from subtlepatterns.com */

@font-face {
	font-family: 'Libel Suit';
	src: url('libel-suit-rg.ttf'); 
	src: 
		local('Libel Suit'),
		local('Libel Suit'),
		url('libel-suit-rg.ttf') 
		format('opentype');
}

body {
	font-family: 		'Libel Suit', sans-serif;
	font-size: 		18px; 	font-size: 	2vw;
	color: 			#333333;
	margin:			0px;
	background-image: 	url("pics/paper.png");
	background-attachment: 	fixed;
}

H1 {
	text-align: 		center;

}

.header {
	width:			700px;
	padding:		0px;
	position: 		relative;
}

.subheader {
	width:			700px;
	padding:		0px;
	position: 		relative;
}

.container {
	width:			50%;
	padding:		0px;
	position:		relative;
}

.fb-follow {			position:			relative;
						top:				10px;
						z-index:			2;
						width:				370px;
						height:				28px;
						background-color:	white;
						border-radius:		5px;
}
.fb-follow iframe {		position:			absolute;
						top:				0px;
						left:				0px;
						width:				370px;
						height:				28px;
}

.content {
	font-family: 		sans-serif;
	font-size: 		22px; 	font-size: 	1.2vw;
	padding:		20px;
	position: 		relative;
}

.sellcellbox {
	width:			500px;
	border-left:		1px solid;
	border-top:		1px solid;
}
.sellcellsub {
	width:			100%;
}
.sellcellleft {
	width: 			250px;
}

.gal {
	border:			2px solid;
	width:			50vw;
	height:			auto;
}

.itembox {
	position:		relative;
}

.deleteditem:after {
	position:		absolute; 
	top: 			0px;
	left:			0px;
	width:			100%;
	font-size:		176px;
	color:			#CC3333;
	border:			0px solid;
	content:		"X X X";
}
.solditem:after {
	position:		absolute; 
	top: 			100px;
	left:			0px;
	width:			100%;
	font-size:		96px;
	color:			#CC3333;
	border:			0px solid;
	content:		"M Y Y T Y";
    -ms-transform: rotate(40deg); /* IE 9 */
    -webkit-transform: rotate(40deg); /* Chrome, Safari, Opera */
    transform: rotate(40deg);}

.sanastobox {
	width:			100%;
	padding-left:	10px;
	padding-right:	10px;
	padding-bottom:	10px;
	font-size:		smaller;
	text-align:		left;
	border:			1px solid;
}
.sanastobox table th {
	background-color:	#CCCCCC;
    border-bottom:	1px solid #999999;
	border-right:	1px solid #CCCCCC;
	font-size:		smaller;
}
.sanastobox table td {
    border-bottom:	1px solid #999999;
	border-right:	1px solid #CCCCCC;
	font-size:		smaller;
}

/* ipad portrait */
@media only screen and ( min-width: 768px) and ( max-width: 980px ) {
	body {
		font-size: 	12px; 	font-size: 	4vw;
	}
	.header {
		width:		500px;
	}
	.subheader {
		width:		500px;
	}
	.container {
		width:		500px;
	}
	.content {
		font-size: 	16px;
		width:		500px;
	}
	.sellcellbox {
		width:		400px;
		border-left:	1px solid;
		border-top:	1px solid;
	}
	.sellcellsub {
		width:		100%;
	}
	.sellcellleft {
		width: 		200px;
	}
	
	.deleteditem:after {
		content:		"X X";
	}
	.solditem:after {
		content:		"MYYTY";
	}
}

/* phone */
@media only screen and ( max-width: 859px) { 
	body {
		font-size: 	24px; 	font-size: 	5vw;
	}
	.header {
		position: 	relative;
		left:		0px;
		width:		300px;
		margin: 	0px;
		padding: 	0px;
	}
	.subheader {
		position: 	relative;
		left:		0px;
		width:		300px;
		margin: 	0px;
		padding: 	0px;
	}
	.container {
		position: 			relative;
		left:				0px;
		width:				300px;
		margin: 			0px;
		padding: 			0px;
	}
	.fb-follow {
		position:			relative;
		top:				10px;
		z-index:			2;
		width:				300px;
		height:				42px;
		background-color:	white;
		border-radius:		5px;
	}
	.fb-follow iframe {
		width:				300px;
		height:				42px;
	}
	.content {
		font-size: 			16px;
		position: 			relative;
		left:				0px;
		width:				300px;
		margin: 			0px;
		padding: 			0px;
	}
	.sellcellbox {
		width:				300px;
		border-left:		1px solid;
		border-top:			1px solid;
	}
	.sellcellsub {
		font-size:			14px;
		width:				100%;
	}
	.sellcellleft {
		width: 				100px;
	}
	.deleteditem:after {
		content:			"X";
	}
	.solditem:after {
		content:			"MYYTY";
	}
}