@charset "UTF-8";

* {
	margin: 0;
	padding: 0;
	border: 0;
	text-decoration: none;
	text-align: left;
	font-weight: normal;
	list-style: none;
	background-color: transparent;
    background-position: 0 0;
	background-repeat: no-repeat;
    line-height: 20px;
    vertical-align: top;
	resize: none;
	}
	
body {
	background-color: #acb1b4;
	}
	
.page .c {
	background-color: #ebebeb;
	}
	
.bar .c, .search .c, .submit .c, .sign .c {
	background-color: transparent;
	}
	
.box .c {
	background-color: #f5f5f5;
	}
	
.field .c {
	background-color: #ffffff;
	}
	
.hint {
	color: #bbbbbb;
	}
	
.field input, .field textarea {
	padding-top: 5px;
	padding-left: 5px;
	}
	
.page .c, .box .c, .field .c {
	overflow: hidden;
	}
    
.box, .field {
	display: inline-block;
	float: left;
	}

.page .t, .page .tl, .page .tr, .page .b, .page .bl, .page .br, 
.box .t, .box .tl, .box .tr, .box .b, .box .bl, .box .br, 
.field .t, .field .tl, .field .tr, .field .b, .field .bl, .field .br, 
.submit .l, .submit .r, 
.sign l, .sign r,
.bar l, .bar r {
	font-size: 1px;
	}

.page .t, .page .tc, .page .b, .page .bc, 
.box .t, .box .tc, .box .b, .box .bc,
.field .t, .field .tc, .field .b, .field .bc {
	height: 10px;
	}
	
.bar .r, .bar .l, .sign .r, .sign .l, .search .r {
	width: 10px;
	}
	
.search .l {
	width: 20px;
	}
	
.search input {
	height: 18px;
	}
	
.bar .c a, .search .c {
	padding-top: 11px;
	}

.page .tl, .page .tr, .page .bl, .page .br, 
.box .tl, .box .tr, .box .bl, .box .br, 
.field .tl, .field .tr, .field .bl, .field .br {
	width: 10px;
	height: 10px;
	}
	
.page .mc, .box .mc, .field .mc {
	padding-left: 10px;
	padding-right: 10px;
	}
	
.bar, .bar .l, .bar .r, 
.search, .search .l, .search .r, .search .c, 
.submit, .submit .l, .submit .c, .submit .r {
	height: 40px;
	}
	
sign, sign .l, sign .r  {
	height: 30px;
	}


	
/************************************************************************** page */
	
.page .tl {
	background-image: url(img/page_tl.gif);
	float: left;
	}

.page .tc {
	background-image: url(img/page_tc.gif);
	background-repeat: repeat-x;
	}
	
.page .tr {
	background-image: url(img/page_tr.gif);
	float: right;
	}
	
.page .ml {
	background: url(img/page_ml.gif);
	background-repeat: repeat-y;
	}
	
.page .mr {
	background: url(img/page_mr.gif);
	background-repeat: repeat-y;
	background-position: right;
	}
	
.page .bl {
	background-image: url(img/page_bl.gif);
	float: left;
	}

.page .bc {
	background-image: url(img/page_bc.gif);	
	background-repeat: repeat-x;
	}
	
.page .br {
	background-image: url(img/page_br.gif);
	float: right;
	}
	
/************************************************************************** box */
	
.box .tl {
	background-image: url(img/box_tl.gif);
	float: left;
	}

.box .tc {
	background-image: url(img/box_tc.gif);
	background-repeat: repeat-x;
	}
	
.box .tr {
	background-image: url(img/box_tr.gif);
	float: right;
	}
	
.box .ml {
	background: url(img/box_ml.gif);
	background-repeat: repeat-y;
	}
	
.box .mr {
	background: url(img/box_mr.gif);
	background-repeat: repeat-y;
	background-position: right;
	}
	
.box .bl {
	background-image: url(img/box_bl.gif);
	float: left;
	}

.box .bc {
	background-image: url(img/box_bc.gif);
	background-repeat: repeat-x;
	}
	
.box .br {
	background-image: url(img/box_br.gif);
	float: right;
	}

/************************************************************************** frame */

.ground70 {
	background: #acb1b4 url(img/ground70.gif);
	width: 70px;
	height: 70px;
	text-align: center;
	float: left;
	}

.frame70 {
	float: left;
	height: 75px;
	}

.frame70:after {
	width: 72px;
	height: 72px;
	margin: 0 0 5px -71px;
	content: url(img/frame70.png);
	}
	
.ground150 {
	background: #acb1b4 url(img/ground150.gif);
	width: 150px;
	height: 150px;
	float: left;
	text-align: center;
	}

.frame150 {
	float: left;
	height: 155px;
	}
	
.frame150:after {
	width: 152px;
	height: 152px;	
	margin: -1px 0 5px -151px;
	content: url(img/frame150.png);
	}
	
/************************************************************************** field */
	
.field .tl {
	background-image: url(img/field_tl.gif);
	float: left;
	}

.field .tc {
	background-image: url(img/field_tc.gif);
	background-repeat: repeat-x;
	}
	
.field .tr {
	background-image: url(img/field_tr.gif);
	float: right;
	}
	
.field .ml {
	background-image: url(img/field_ml.gif);
	background-repeat: repeat-y;
	}
	
.field .mr {
	background-image: url(img/field_mr.gif);
	background-repeat: repeat-y;
	background-position: right;
	}
	
.field .bl {
	background-image: url(img/field_bl.gif);
	float: left;
	}

.field .bc {
	background-image: url(img/field_bc.gif);
	background-repeat: repeat-x;
	}
	
.field .br {
	background-image: url(img/field_br.gif);
	float: right;
	}
	
/************************************************************************** bar */

.bar {
	background-image: url(img/bar_c.gif);
	background-repeat: repeat-x;
	}
	
.bar .l {
	background-image: url(img/bar_l.gif);
	float: left;
	}

.bar .r {
	background-image: url(img/bar_r.gif);
	background-position: right;
	float: right;
	}
	
/************************************************************************** submit */

.submit {
	float: left;
	}

.submit .l, .submit .r {
	width: 10px;
	}

.submit input {
	text-transform: uppercase;
	text-align: center;
	height: 40px;
	margin-top: -40px;
	color: #666666;
	text-shadow: white 0 1px 0;
	}
	
.submit:active input{
	margin-top: -39px;
	}

.submit .c {
	background-image: url(img/submit_c.gif);
	background-repeat: repeat-x;
	background-position: top;
	}
	
.submit .l {
	background-image: url(img/submit_l.gif);
	background-position: top;
	float: left;
	}

.submit .r {
	background-image: url(img/submit_r.gif);
	background-position: right;
	background-position: top;
	float: right;
	}

.submit:hover .l, .submit:hover .c , .submit:hover .r {
	background-position: center;
	}
	
.submit:active .l, .submit:active .c , .submit:active .r {
	background-position: bottom;
	}	

/************************************************************************** Search Images */

.search {
	background-image: url(img/search_c.gif);
	background-repeat: repeat-x;
	}
	
.search .l {
	background-image: url(img/search_l.gif);
	float: left;
	}

.search .r {
	background-image: url(img/search_r.gif);
	background-position: right;
	float: right;
	}

.edit {
	background-image: url(img/edit.gif);
	background-position-x: right;
	margin-top: 4px;
	width: 46px;
	height: 17px;
	float: right;
	}
	
.edit:hover {
	background-position-y: center;
	}
	
.edit:active {
	background-position-y: bottom;
	}
	
/************************************************************************** Buttons */

.forward {
	background-image: url(img/button_fw.gif);
	width: 40px;
	height: 40px;
	}
	
.backward {
	background-image: url(img/button_bw.gif);
	width: 40px;
	height: 40px;
	}

/************************************************************************** Marker */

.marker {
	height: 20px;
	width: 20px;
	float: right;
	}

.marker.white {
	background-image: url(img/marker_white.gif);
	}
	
.marker.gold {
	background-image: url(img/marker_gold.gif);
	}
	
.marker.red {
	background-image: url(img/marker_red.gif);
	}
	
/************************************************************************** Basics */

.hr {
	height: 2px;
	width: 100%;
	margin: 4px 0 3px;
	background-image: url(img/line.gif);
	background-repeat: repeat-x;
	clear: both;
	}
	
.center {
	text-align: center;
	}
	
.left {
	text-align: left;
	float: left;
	}
	
.right {
	text-align: right;
	float: right;
	}

.clear {
	clear: both;
	}

.col {
	min-height: 10px;
	float: left;
	}

.vg {
	height: 10px;
	width: 9px;
	float: left;
}

.hg {
	height: 10px;
	width: 100%;
	float: left;
}