/*** LAY-OUT ***/

html, body {height: 100%;}
html, body, div {margin: 0; padding: 0; border: 0px solid #E00;}
img {border: 0;}
a img {border: 0;}
br.clear {clear: both;}
h1, h2, h3 { /*padding-right: 80px;*/}
div#backgroundContainer {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; margin: 0; padding: 0; overflow: hidden;}
body>div#backgroundContainer {position: fixed;}
div#backgroundContainer img {width: 100%; height: 100%;}

img#background::selection {background: transparent; background: transparent; /* Safari */}
img#background::-moz-selection {background: transparent; background: transparent; /* Firefox */}

div.wrapper {width: 954px; margin: 0 auto; padding: 0 20px;}

div#header {height: 140px;}
div#header div.wrapper {position: relative;}

div#logo {position: absolute; z-index: 0; width: 954px; height: 129px; padding-top: 11px;}

div#login, div#search {position: absolute; top: 105px;}
	div#login {left: 20px;}
	div#search {right: 20px;}

div#menu {height: 60px; text-align: center;}

div#container div.wrapper {margin-bottom: 20px;}
div.leftCol {float: left; display: inline; width: 633px;}

	/* lay-out 1 (two same sized sub-columns) */
	div.leftSubCol1 {float: left; display: inline; margin-right: 10px; width: 305px;}

	/* lay-out 2 (small and large sub-columns) */
	div.leftSubCol2a {float: left; display: inline; margin-right: 10px; width: 154px;}
	div.leftSubCol2b {float: left; display: inline; margin-right: 10px; width: 456px;}
	
div.rightCol {float: right; display: inline; width: 323px; margin-right: -3px;}

div#loginPopup {position: absolute; top: 100px; left: 100px; width: 300px; height: 200px; background-color: #FFF; z-index: 99; color: #000;}

div.widget {position: relative; z-index: 0; margin: 5px -3px 10px 0; background: url("../images/side_widget_bg.png") no-repeat top left; width: 323px; height: 139px;}
	div.widget h1 {position: absolute; top: -6px; left: -2px; z-index: 1; width: 320px;}
	div.widget span.go {position: absolute; bottom: 9px; right: 7px;}
	div.widget img.photo {width: 320px; height: 135px;}
div.widget_playground {width: 323px;}	
	div.widget_playground h1 {margin: 0;}
	div.widget_playground h1 img {position: relative; top: -2px;}
	
/*** MARK-UP ***/

html, body {height: 100%;}
body {font-family: helvetica, arial; color: #FFF; background-color: #bf0066; background-image: url("../images/content_bg.jpg"); background-position: center; font-size: 11px; line-height: 14px; z-index: 0; position: relative; border-top: 1px transparent solid; margin-top: -1px;}
hr {height: 0; border: 0; border-top: 2px dashed #FFF;}
div.hr {height: 7px; background: url("../images/hr.png"); margin: 8px 0;}

/* forms and fields */

form, input {margin: 0; padding: 0;}
input {background: transparent; border: 1px solid #FFF; color: #000; padding: 3px 4px; margin: 0 5px 5px 0;}
#popupLogin input { color: #FFFFFF; }
#popupLogin input[type=submit] { text-indent: -9999px;}
input.filestrImage { color: #000000;}
/*	input:focus {outline: 0;}*/
input[type=submit], input.defaultbutton {background: transparent url("../images/gobutton.png"); width: 22px; height: 22px; /*color: transparent;*/border: 0; cursor: pointer;}


#uplForm input[type=file] {width: 230px !important}
#uplForm input.defaultbutton {margin-left: 0px;}

input.large {font-size: 13px; width: 300px;}
input.searchbox {width: 157px; height: 18px; background: transparent url("../images/searchbox.png"); padding: 2px 4px; border: 0; color: #999; text-align: center; margin: 0 4px 0 0;}
	input.searchbox:focus {outline: 0; color: #FFF; text-align: left;}
input.searchbutton {background: transparent url("../images/searchbutton.png"); width: 22px; height: 22px; /*color: transparent;*/border: 0; cursor: pointer;}

/* lists */

ul {list-style-type: none; padding: 0;}
ul li {margin: 0 0 0 -30px; padding: 8px 0 4px 30px; min-height: 22px; vertical-align: middle;}
	ul li.li1 {background: url("../images/1.png") no-repeat left;}
	ul li.li2 {background: url("../images/2.png") no-repeat left;}
	ul li.li3 {background: url("../images/3.png") no-repeat left;}
	ul li.li4 {background: url("../images/4.png") no-repeat left;}
	ul li.li5 {background: url("../images/5.png") no-repeat left;}

/* heading */

h1 {margin-top: 0;}

.sifrme, .sifrmeblue {font-size: 22px; display: inline; line-height: 22px;}
.sifrme				{background-color: #000000; padding-top: 10px;}
h2.sifrme, h3.sifrmeblue {margin-top: 25px;}

h1.sifrmeblue, h2.sifrmeblue {color: #FFFFFF; background-color: #1EA2BD; padding-top: 10px;}
h3.sifrmeblue {color: #1EA2BD;}

/* hyperlinks */

a {color: #FFF;}
a:hover {color: #ea006d;}

p a {font-weight: bold;}

a:hover div.homePanel, a:hover div.bubble span, a:hover div.bubble_small span {color: #ea006d;}

div#menu a {background-color: #000; text-transform: uppercase; font-size: 15px; padding: 2px 3px; text-decoration: none; font-weight: normal;}
div#menu a:hover {text-decoration: underline;}
div#menu a.active {background-color: #1EA2BD;}

div#menu object {outline: none}

/* header */

div#header {background-color: #000; background: url("../images/yms_inc_header.jpg"); background-position: center;}

div#logo {text-align: center;}

div#login {background: url("../images/loginbox.png"); width: 193px; height: 22px;}
	div#login p {margin: 1px;}
	div#login p.loggedout {text-align: center; color: #999; margin-top: 4px;}
	div#login a {text-decoration: none;}
	div#login a:hover img {opacity: 1;}
	div#login img {width: 20px; height: 20px; margin: 0 3px 0 6px; opacity: 0.7; vertical-align: middle;}

/* footer */

div#footer {
	position: relative;
	background: transparent; background-image: url("../images/footer_bg.png"); background-repeat: no-repeat; background-position: top left;
	height: 40px; padding-top: 16px;
	color: #ea006d; font-family: "Arial Black", arial, helvetica; text-transform: uppercase; letter-spacing: 1px; font-size: 11px;
}
div#footer a {color: #ea006d; text-decoration: none;}
div#footer a:hover {color: #FFF; text-decoration: underline;}
div#footer div#banners {position: absolute; right: 15px; top: 15px;}
	div#footer div#banners a.banner {margin-right: 5px;}
div#footer img.logo {vertical-align: middle; margin: -2px 4px 0 -4px;}

/* pop-ups */

#backgroundPopup {display:none; position:fixed; _position:absolute; height:100%; width:100%; top:0; left:0; background:#000000; border:1px solid #cecece; z-index:2;}

#popupLogin {  
	display:none;  
	position:absolute;
	height:151px;  
	width:326px;  
	background: url("../images/popupLogin_bg.png") no-repeat;
	z-index:3;
	padding:12px;
}
.popupViewer {
	display: none;
	position: absolute;
	height: 376px;
	width: 584px;
	background: url("../images/lightbox_bg.png") no-repeat;
	z-index: 4;
	padding: 12px;
}
	.popupViewer h1 {margin-left: 35px; display: block; float: left; margin-top: 3px;}
	.popupViewer span.user {float: right; margin-right: 35px;}
		.popupViewer span.user img {width: 30px; height: 30px; display: block; float: left;}
		.popupViewer span.user span {margin-left: 7px; display: block; float: left; margin-top: 8px;}
	.popupViewer div.viewer {width: 512px; height: 288px; background-color: #FFF; margin: auto; margin-top: 3px; overflow: hidden;}
	.popupViewer div.votebox {width: 512px; text-align: center; margin: auto; margin-top: 20px;}

span#popupClose, span.lightboxClose {right:-6px; top:-6px; position:absolute; color:#ea006d; display:block; cursor: pointer;}

/* specific */

/* - 0.0 home */
div.homePanel {position: relative; width: 308px; height: 216px; background-image: url("../images/panel_bg2.png"); margin-bottom: 15px; margin-right: -3px; color: #000;}
	div.homePanel h1 {z-index: 2; position: absolute; top: -4px; display: block; margin: 0; width: 305px; background: transparent; padding: 0;}
	div.homePanel p {margin: 6px;}
div#playground h1 {background: transparent; padding: 0;}
div.bubble {width: 308px; height: 39px; background: url("../images/bubble_bg2.png"); margin-bottom: -4px; margin-right: -3px;}
	div.bubble img {float: left; margin: 2px 2px 0 5px; width: 30px; height: 30px;}
	div.bubble span {display: block; float: left; height: 30px; margin: 3px 2px 2px 2px; color: #000;}
div.bubble_small {float: left; width: 162px; height: 39px; margin-right: -2px; margin-bottom: -4px; background: url("../images/bubble_small_bg2.png");}
	div.bubble_small img {float: left; margin: 2px 2px 0 5px; width: 30px; height: 30px;}
	div.bubble_small span {display: block; float: left; height: 30px; margin: 3px 2px 2px 2px; color: #000; width: 118px; overflow: hidden;}
div.stitch, div.stitch2 {padding-left: 13px; margin-bottom: 17px;}
div.stitch {background-image: url("../images/sideline1.png"); background-repeat: no-repeat; background-position: left top;}
div.stitch2 {background-image: url("../images/sideline2.png"); background-repeat: no-repeat; background-position: left top;}

/* - 1.0, 2.0 contest */
div.coverpic {width: 157px; height: 120px; background: url("../images/contest_img_bg.png") no-repeat top left; margin-right: -3px; margin-bottom: -4px;}
	div.coverpic img {width: 154px; height: 115px;}
div.items, div.items_small {position: relative; margin-top: 20px;}
div.items_small {width: 323px;}
	
	div.items .more, div.items_small .more {display: block; position: absolute; right: 20px; top: 5px;}
	a.more	{float: right}
	div.items div.item {width: 119px; height: 69px; margin-right: 5px; margin-top: 6px; background: url("../images/contest_item_bg.png") no-repeat top left; display: block; float: left;}
	div.items div.item { text-align: center; }
	div.items div.item img { 
			margin: auto;
			/* width: 116px; */
			text-align: center;
			height: 65px;
			width: 100px;
		}
	div.items_small div.item {width: 103px; height: 60px; margin-right: 4px; margin-top: 4px; background: url("../images/contest_item_small_bg.png") no-repeat top left; display: block; float: left;}
		div.items_small div.item img {width: 100px; height: 56px;}
		
	div.sidebar div.items div.item {width: 100px;}
		
div.pagination {display: block; text-align: center; font-size: 12px;}
	div.pagination a {margin: 0; padding: 2px 5px;}
	a.active {margin: 0 2px; padding: 2px 5px; background-color: #1EA2BD; color: #FFF; text-decoration: none;}
	a.active:hover {color: #FFF;}

/* - 3.0 playground */
div.topic {width: 620px; margin-bottom: 13px;}
div.topic, div.thread {position: relative;}
div.topic_info {background-color: #000; padding-top: 5px; width: 616px; margin-left: 0px;}
div.thead_info {position: absolute; top: 140px; left: 315px;}
div.topic span.info {position: absolute; left: 315px; top: 10px;}
div.thread span.info {top: 14px;}
div.topic span.info img {width: 30px; height: 30px; margin-right: 5px;}
div.topic span.info img, div.thread span.info span {float: left;}
div.thread {color: #999; background-image: url("../images/playground_bubble_bg2.png"); width: 615px; height: 52px; margin-right: -3px; margin-bottom: -3px; padding: 4px ;}
div.topic_info, div.thread p {padding-left: 5px;}
div.topic a {color: #000;}
div.thread p a {font-size: 13px;}

/* - 3.1 playground thread */
div.post {background: url("../images/playground_post_bg.png"); width: 617px; margin-right: -3px; margin-bottom: 1px; padding: 3px;}
	div.post span.postinfo {width: 154px; margin: 4px 10px 4px 5px; color: #999;}
		div.post span.postinfo img {width: 30px; height: 30px; margin-right: 5px;}
		div.post span.postinfo img, div.post span.postinfo span {float: left;}
		div.post span.postinfo span {width: 114px;}
	div.post span.posttext {width: 400px; color: #000; padding: 4px 0;}
		div.post span.posttext form {width: 440px;}
		div.post span.posttext textarea {width: 400px; height: 45px; vertical-align: middle;}
	div.post span.postinfo, div.post span.posttext {float: left;}
div.post_bottom {background: url("../images/playground_post_bg_bottom.png"); width: 623px; height: 4px; margin-top: -1px; margin-right: -3px; margin-bottom: 4px;}

/* - 4.0 default */
div.textpage_top {width: 623px; height: 7px; background: url("../images/defaultpage_bg_top.png"); padding: 0; background-position: top left;}
div.textpage {width: 578px; background: url("../images/defaultpage_bg_middle.png") repeat-y; padding: 0 20px 0 25px; color: #000;}
div.textpage_bottom {width: 623px; height: 17px; background: url("../images/defaultpage_bg_bottom.png");}
div.textpage a {color: #000;}
div.textpage a:hover {color: #ea006d;}

/* - 5.0, 5.1 profile */
div.profile_avatar {width: 305px; position: relative;}
	div.profile_avatar h1 {position: absolute; top: -4px; left: -2px;}
	div.profile_avatar img.photo {width: 305px; min-height: 160px;}
a.profile_button {margin-right: 10px;}
a.edit {float: right; margin-top: 7px; text-decoration: none; border-bottom: 1px dotted #FFF;}
a.edit:hover {border-bottom: 1px dotted #ea006d;}
table.editprofile {border-collapse: collapse; background: url("../images/defaultpage_bg_middle.png"); width: 623px; color: #000;}
	table.editprofile th {width: 164px; font-weight: normal; text-align: right; padding-right: 10px; vertical-align: top;}
	table.editprofile th label {position: relative; top: 5px;}
	table.editprofile td label {margin-right: 9px;}
	table.editprofile input[type=text], table.editprofile input[type=password], table.editprofile textarea {width: 400px; color: #000; font-size: 12px; background-color: #FFF; border: 1px solid #999;}
	table.editprofile input[type=radio] {margin: 5px 5px 5px 0;}
	table.editprofile textarea {height: 100px;}
	
#voteBox { margin-top: -20px; }	
#voteBox img { float: left; }
#voteBox img.rspace { padding-right: 5px; }