/* -------------------------------------------------------------- 
  

	Screen.css - import for screens.
   
-------------------------------------------------------------- */

@import "reset.css";
@import "typography.css";
@import "tabs.css";

/* Body and Structure
-------------------------------------------------------------- */
html,body {
	background: #32261A;
}


div#container{
	margin:0 auto; 
	width:908px;
	height: 765px;
	min-height:765px;
	max-height: 765px;
}

div#inner01, div#inner02{
	height:738px;
	border-left: 4px solid #5E5550;
	border-right: 4px solid #5E5550;
	background: #F8F7F1;
}

div#inner01{background:#FAF9EE;}
div#inner02{background:url("../../~media/img/content02_bg.gif") repeat-y #FAF9EE;} /*faux-columns*/

/* Header
-------------------------------------------------------------- */

div#header {
	background: #F8F7F1;
	height:168px;
}

div#header .tabs {
	padding: 0 0 0 45px;
	list-style-type:none;
	height:30px;
	background:url(../../~media/img/menu/menu_bg.gif) repeat-x top #32261a;
	border-top: solid 4px #fff;
	border-bottom: solid 4px #fff;
}

div#header .tabs li {
	overflow: hidden;
}
	

div#header .tabs li a{
	text-decoration:none;
	padding:0 30px 0 0;
	height:30px;
	text-indent:-9000px;
}
	
div#header .tabs li.m01 a { width:63px; background:url(../../~media/img/menu/01home01.gif) no-repeat; }
div#header .tabs li.m01u a { width:63px; background:url(../../~media/img/menu/01home02.gif) no-repeat; }
div#header .tabs li.m01 a:hover { background:url(../../~media/img/menu/01home03.gif) no-repeat; }

div#header .tabs li.m02 a { width:107px; background:url(../../~media/img/menu/02aboutus01.gif) no-repeat left top; }
div#header .tabs li.m02u a { width:107px; background:url(../../~media/img/menu/02aboutus02.gif) no-repeat left top; }
div#header .tabs li.m02 a:hover {	background:url(../../~media/img/menu/02aboutus03.gif) no-repeat left top; }

div#header .tabs li.m03 a{ width:113px; background:url(../../~media/img/menu/03ourwork01.gif) no-repeat left top; }
div#header .tabs li.m03u a{ width:113px; background:url(../../~media/img/menu/03ourwork02.gif) no-repeat left top; }
div#header .tabs li.m03 a:hover{	background:url(../../~media/img/menu/03ourwork03.gif) no-repeat left top; }

div#header .tabs li.m04 a{ width:68px; background:url(../../~media/img/menu/04login01.gif) no-repeat left top; }
div#header .tabs li.m04u a{ width:68px; background:url(../../~media/img/menu/04login02.gif) no-repeat left top; }
div#header .tabs li.m04 a:hover{ background:url(../../~media/img/menu/04login03.gif) no-repeat left top; }		

div#header .tabs li.m05 a{ width:63px; background:url(../../~media/img/menu/05news01.gif) no-repeat left top; }
div#header .tabs li.m05u a{ width:63px; background:url(../../~media/img/menu/05news02.gif) no-repeat left top; }
div#header .tabs li.m05 a:hover{ background:url(../../~media/img/menu/05news03.gif) no-repeat left top; }

div#header .tabs li.m06 a{ width:132px; background:url(../../~media/img/menu/06contactus01.gif) no-repeat left top; }
div#header .tabs li.m06u a{ width:132px; background:url(../../~media/img/menu/06contactus02.gif) no-repeat left top; }
div#header .tabs li.m06 a:hover{	background:url(../../~media/img/menu/06contactus03.gif) no-repeat left top; }

/* sidebar
-------------------------------------------------------------- */

div#side-left{
	float:left;
	margin:90px 0 0 0; /*use margin instead of padding, avoid IE bug*/
	width: 200px;
	height: 160px;
}

div#side-left ul{
	list-style: none;
}

div#side-left li{
	height: 23px;
}


/* main (w: sidebar)
-------------------------------------------------------------- */

div#main{
	float:left;
	padding: 0px 100px 0px 75px;
	width:525px;/*700*/
	height: 570px; /*container - header - footer - padding*/
	min-height: 570px;
	max-height: 570px;
	overflow: auto;
	overflow-x: hidden;
}

div#main #pad40{
	padding: 40px 0 0 0;
}

h4.video, h4.news { 
	display: inline;
	float:  right;
	padding-bottom: 25px; 
}

.post {
	clear: both;
	overflow:hidden;
	width:525px;
	padding-bottom: 20px;
}

div.post h5 { 
	padding: 5px;
	color: #000; /* #5E5550; */
	border-bottom: solid 1px #d78f84; /* #994046; */
}

div.post iframe {
	margin: 10px 62px 20px;
}  
 
.p01 {
	width:170px;
	float:left;
}

.p02 {
	display: inline;
	width:355px;
	border-left:170px;
	float:right;
}

.cam {
	float: left;
	width: 141px; height: 45px;
	margin:0; padding:0;
	background: url( '../../~media/img/camera.gif') 0 -45px no-repeat;
}

.cam a {
	display: block;
	margin: 0; padding:0;
	width:100%; height:100%;
	overflow:hidden;
	font: bold 13px/1 Georgia, serif;
	text-decoration: none;
	background: url( '../../~media/img/camera.gif' ) top left no-repeat;
}

.cam a:hover {
	background-image: none;
}

/* single page
-------------------------------------------------------------- */

#mast{
	background:#E8E7E1;
	padding: 9px 200px 9px 50px;
	color:#994046;
	font-size: 1.286em; /*18px*/
	background:#E8E7E1;
}

#single {
	width:800px;
	padding: 10px 50px 10px 50px;
}

.thumb {
	padding: 14px 15px 14px 15px;
	width:370px;
	float:left;
}	

.thumb img {
	float:left;
	border:solid 3px #5E5550;
	margin:0 10px 0 0;
}

.thumb h3 {
	padding:0 0 15px 0;
}
		
.thumb p {
	font-size: 0.857em; /*12px*/
	letter-spacing: -0.1px;
	line-height: 1.4em;
}
/* footer
-------------------------------------------------------------- */

div#footer{
	border-top:4px solid #5E5550;
	clear:both;
	padding: 8px 0 0 0;
	height:15px;
}

div#footer p img { vertical-align: middle; }

/* login
-------------------------------------------------------------- */

#login {
	position: relative;
	top: -50px;
	padding:10px;
	text-align: center;
	width: 308px;
	background: #DCDCDC;
	border: 2px solid white;
}	

/* contact
-------------------------------------------------------------- */

#contact {
	width: 350px;
	padding:150px 225px 0 225px;
}

.c01 {
	width:100px;
	float:left;
}

.c02 {
	display: inline;
	width:250px;
	float:left;
}

/*other + reuse
-------------------------------------------------------------- */

.hnarrow {
	line-height: 1.4em;
}
	
.preload{
	left:-9000px;
	display:none;
}	
			
.clr{
	clear:both;
}

img.fleft{
	float: left;
	margin: 0 10px 10px 0;
	border: 1px solid #888888;
}

img.thleft{ /*152 x 114*/
	display: inline; /*ie 6 fix*/
	float:left;
	border:solid 3px #5E5550;
	margin:5px 12px 30px 0;
}

img {
	/*display: block; ie 7 fix*/
	border:none;
}

a img {
    outline: none;
}
