/* CSS Document */
/*
inhye lee
seatomato.com early 2007 edition
*/
body {
width: 892px;
background:#fff;
margin: 0 auto;
padding: 0;
text-align: center;
font-family: Verdana, Arial, sans-serif;
line-height:1.3em;
font-size: 70%;
}


/*Basic Layout*/
#page {
position: relative;
width: 892px; 
background:#fff;
text-align: left;
height: auto;
padding: 2px;
/*border: 1px solid #545050; */
margin:0 auto;
margin-top:20px;
float:left;

}

#contents {
padding:0; margin:0;
float: left;width: 892px; 
}

#footer {
float: left;
border-top:dashed 1px #cccccc;
display: block;
width: 892px;
height: 30px;
padding: 0px 0px;
margin-top: 10px;
background:url(../img/footer.gif) no-repeat center center;
clear:both;
}

/***********Beginning of MENU LIST**********/
#menu {
padding:0;
width: 892px;
list-style: none;
text-indent: -3000px;/*menu text invisible*/
}

#menu li {
margin: 0;
padding:0;
list-style: none;
display: inline;
}

#menu ul li, #menu a {
float: left;
height: 56px;
display: block;
}

#home ul li, #home a {
width: 279px;
background: url(../img/seatomato_logo.gif) top left no-repeat;
}

#work ul li, #work a {
width: 113px;
background: url(../img/work01.gif) top left no-repeat;
}

#work a:hover, #work a:active{
background: url(../img/work02.gif)
}

#work a.selected{
background: url(../img/work03.gif)
}

#creative ul li, #creative a {
width: 198px;
background: url(../img/creative01.gif) top left no-repeat;
}

#creative a:hover, #creative a:active{
background: url(../img/creative02.gif)
}

#creative a.selected{
background: url(../img/creative03.gif)
}

#daily ul li, #daily a {
width: 105px;
background: url(../img/daily01.gif) top left no-repeat;
}

#daily a:hover, #daily a:active{
background: url(../img/daily02.gif)
}

#daily a.selected{
background: url(../img/daily03.gif)
}

#bio ul li, #bio a {
width: 100px;
background: url(../img/bio01.gif) top left no-repeat;
}

#bio a:hover, #bio a:active{
background: url(../img/bio02.gif)
}

#bio a.selected{
background: url(../img/bio03.gif)
}

#contact ul li, #contact a {
width: 97px;
background: url(../img/contact01.gif) top left no-repeat;
}

#contact a:hover, #contact a:active{
background: url(../img/contact02.gif)
}

#contact a.selected{
background: url(../img/contact03.gif)
}
/******End of MENU LIST********/

#statusBar {
width: 890px;
margin: 3px 0px;
height: 3px;
border: 1px solid #ffffff;
float: right;
display: block;
}
.statusWork {
background:url(../img/status_work.gif) repeat-y top left; 
}
.statusCreative {
background:url(../img/status_creative.gif) repeat-y top left; 
}
.statusDaily {
background:url(../img/status_daily.gif) repeat-y top left; 
}
.statusBio {
background:url(../img/status_bio.gif) repeat-y top right; 
}
.statusContact {
background:url(../img/status_contact.gif) repeat-y top right; 
}

/**For Some Correction**/

.spacerWhole {
float: left;
width:890px;
height: 1px;
display: block;
background:#FFF;
border:1px solid #FFFFFF;
}

/*Intro page*/
#introStuff {
float:left;
text-align:center;
margin:0;
padding: 0px;
margin-left:0px;

}


/*Left-Right Des below the menu*/
#workListDes, #creativeListDes {
display: block;
background: #DDD;
padding: 25px;
color: #545050;
margin: 0px;
margin-bottom:5px;
margin-right: 10px;
}

#workListDes {
width: 495px;
float: right;
border-left: solid 3px #BB191A;
}
#creativeListDes  {
width: 420px; /*493px*/
float: left;
border-right: solid 3px #BB191A;
margin-left:20px;
}
.redHighlitedTxt {
background: #BB191A;
color:#ccc;
padding: 0px 5px;
}

.listTxt {
color: #999;
font-weight: 100;
} 

/*Work Pages*/
.workListImage {
border: 1px solid #BB191A;
float: left;
margin-left: 26px;
margin-right: 26px;
}


#workListLeft, #workListRight {
width: 444px;
padding: 0px;
margin-top:3px;
font:verdana, sans-serif;
color: #BB191A;
font-size:11px;
}

#workListLeft {
float: left;
margin-right:2px;
}
#workListRight {
float: right;
margin-right:2px;
}

#workListLeft ul, #workListRight ul {
list-style: none;
margin:0;
padding:0;
}
#workListLeft li, #workListRight li {
display:block;
border: 1px solid #dddddd;
background: #F9F9F9;
clear: left;
height: 62px;
margin-bottom: 2px;
text-decoration: none;
color: #BB191A;
}
#workListLeft li a, #workListLeft li a:link, #workListLeft li a:hover, workListLeft li a:visited, 
#workListRight li a, #workListRight li a:link, #workListRight li a:hover, #workListRight li a:visited {
display: block;
text-decoration: none;
color: #545050; font-weight: bold;
}
#workListLeft li a:hover, #workListRight li a:hover {
color: #BB191A; 
}

/*CREATIVE PAGES*/
#creativeListLeft1, #creativeListLeft2, #creativeListRight1, #creativeListRight2 { /* Parent Wrapper for inside boxes */
 display: inline; /* IE Hack */
 width: 222px;
 float: left;
 padding: 0px;
 margin-right:1px;
}
#creativeListLeft1 ul, #creativeListLeft2 ul, #creativeListRight1 ul, #creativeListRight2 ul {
list-style: none;
margin:0;
padding:0;
}
#creativeListLeft1 li, #creativeListLeft2 li, #creativeListRight1 li, #creativeListRight2 li {
display: block;
background: #F9F9F9;
border: 1px solid #DDD;
border-bottom: 5px solid #545050;
width: 218px;  margin-right:2px;
height: 120px; 
margin:0;
margin-bottom: 3px;
padding-top:5px; padding-bottom: 5px;
}

#creativeListLeft1 li a, #creativeListLeft1 li a:link, #creativeListLeft1 li a:visited, 
#creativeListLeft2 li a, #creativeListLeft2 li a:link, #creativeListLeft2 li a:visited,
#creativeListRight1 li a, #creativeListRight1 li a:link, #creativeListRight1 li a:visited, 
#creativeListRight2 li a, #creativeListRight2 li a:link, #creativeListRight2 li a:visited {
display: block;
text-decoration: none;
color: #666666;  

}
#creativeListLeft1 li a:hover, #creativeListLeft2 li a:hover, #creativeListRight1 li a:hover, #creativeListRight2 li a:hover{
color:#BB191A; 
}

.creativeListImg {
 border: 1px solid #869197;
 padding: 0px;
 margin: 5px;
 margin-top: 0px;
 float:left;
}
.crListTitle {
 color:#E1E3E2; 
 text-decoration: none; font-weight:bold;
 background: #000000;  display: display; padding-left: 10px; margin-bottom: 5px;
}

/**Daily Blog Pages***/
#dailyMainContents {
	width: 620px;
	/* background: #E1E3E2; */
	float: left;
	height:auto;	

	padding-left: 10px;
	padding-right: 10px;
	
	padding-bottom: 10px;
	}
#dailySubNav {
	display: block;
	padding: 10px;
	margin: 0px;
	width: 200px;
	float: right;
	height:auto; 
	background: #E1E3E2;
	border-left:dashed 1px #CCCCCC;
	border-top: solid 10px #CCCCCC;
	color: #545050;
	}
#dailySubNav ul{
	margin: 0; padding:0;
	list-style: none;
	margin-bottom: 20px;
	}
#dailySubNav li {
	margin: 0px 1px 3px 0px;padding:0;
	list-style: none;
	}
#dailySubNav li li{
	margin-bottom: 1px; margin-left: 10px;
	}
li .dailySubNavTitle {
	margin-left: 0px;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
	}
.post {
	margin-bottom: 15px;
	padding-bottom: 5px;
	border-bottom:1px dashed #FFF;
	}
.entry {
	color: #545050;
	font-size: 1.2em;
	}	
.date {
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 1.0em; margin:0;
	color: #545050;text-align:left; 
	}
h2, h3 {
	font-family: 'Trebuchet MS', 'Lucida Grande', Verdana, Arial, Sans-Serif;
	font-weight: bold; 	color: #BB191A; 
	text-decoration: none; margin-bottom: 5px;
	}	
h2 {font-size:1.8em; }	
h3 {font-size:1.5em;}

.postmetadata {
text-align: right;
}

.navEntries {
	display: block;
	text-align: center;
	margin-top: 10px;
	margin-bottom: 60px;
	}

.alignright {
	float: right;
	}
	
.alignleft {
	float: left
	}
form {
	margin: 0;
	}
 /**    Links style  in Blog pages **/
#dailySubNav a, #dailySubNav a:visited, #dailySubNav a:hover {
	text-decoration: none;	color: #545050; display: inline;  padding: 1px ;
	}
#dailySubNav a:hover {background:#000;color: #fff;}
.entry a:link, .entry a:visited, .entry a:hover {display: inline; padding: 0px 2px;}
.entry a:link, .entry a:visited {text-decoration: underline; color: #545050; background:#ccc;}
.entry a:hover {text-decoration: none; color: #FFF; background: #000;}
.postmetadata a, .postmetadata a:visited, .postmetadata a:hover {
	text-decoration: none;	color: #BB191A; display: inline;  padding: 1px ;
}
.postmetadata a:hover {text-decoration: underline;}

.navEntries a, .navEntries a:visited, .navEntries a:hover {
	text-decoration: none;	color: #BB191A; font-weight: bold; display: inline;  padding: 1px  ;
}
.navEntries a:hover {text-decoration: underline;}

.postComment a:link, .postComment a:visited, .postComment a:hover {
text-decoration: underline;	color: #545050; display: inline;  padding: 1px  ;
}
h2 a, h2 a:visited, h2 a:hover {
	color: #BB191A;text-decoration: none;
	}	
h3 a, h3 a:visited, h3 a:hover {
	color: #671213; text-decoration: none;
}	
/*blockquote*/
blockquote {
background-color: #FFF;
border:1px dotted #545050;
padding: 5px 5px;
}

/** Image in Blog pages **/
.entry img {
	border: none;
	clear:both;
	padding: 10px 0;
	}

a img, a:link img, a:visited img, a:hover img {
	border: none;
	}
	
/****Work Details Page****/	
#workTitle, #workDetail {
	width: 890px;	
	float: left;
	
}
#workTitle {
	height: 60px;
	border: 1px solid #ccc;
	border-top: 10px solid #ccc;
	border-bottom: 10px solid #ccc;
	font-weight: bold;
	color: #BB191A; font-size:1.1em;
}
.workDetailImage {
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
float: left;
margin-left: 26px;
margin-right: 26px;
}

#workDetail {
color: #545050;	
	border-top: none;
	padding-top: 10px;
	padding-bottom: 10px;
}
#workDetail p {
margin-left: 129px;margin-right: 26px;
}
#workDetail img {
clear: both;
margin:5px 0px;
border: 1px solid #ccc;
border-top: 5px solid #BB191A;
border-bottom: 5px solid #ccc;

}
/*link style @Work Pages**/
.linkRedBlock a, .linkRedBlock a:hover, .linkRedBlock a:active {
background:#999;
color: #FFFFFF;
text-decoration: none;
padding: 0px 3px;
display:inline;
}
.linkRedBlock a:hover {
color: #000;
}
.linkSquare {
 background:url(../img/link_square.gif) left center no-repeat;
 padding-left:13px; 
 margin-left: 5px;	
 color: #000; 
 display: inline;
}
.linkSquare a, .linkSquare a:hover, .linkSquare a:active{
 color: #000; 
 text-decoration:underline; 
 display: inline;
}
.linkSquare a:hover {
color: #BB191A;
}	
#backToListBtn {
float: right;
margin: 10px;
background:url(../img/btn_backtolist01.gif) no-repeat;
width: 128px;
height: 39px;
text-indent: -3000px;/*invisible*/
}


.redSubText {
font-weight:bold;
color: #BB191A;
}
.redImageText {
color: #795758;
font-weight: 100;
font-size: 80%;
}	

/*CREATIVE DETAILS page*/

#creativeDetailsBanner, #creativeDetails {
width: 890px;	
float: left;
}

#creativeDetailsBanner {
display: block;
text-align:left;
background: #000;
margin-top: 10px; margin-bottom: 10px;
height: 100px;
border: 1px solid #ccc;
border-left: none;
}
.cDetailTopImg {
border-left: 10px solid #BB191A;
border-right: 10px solid #000;
margin-right: 32px;
float: left;
}

#creativeDetails {
float: right;
color: #545050;	
}
#creativeDetails p{
margin: 10px;
margin-left: 150px;
margin-right: 50px;
}
.crDetailsTitle {
font-size:1.8em; 
line-height:1em;
font-weight: bold;
color:#BB191A;
}
.crDeailsTxt1, .crDeailsTxt2 {
font-size: 1.0em;
}
.crDeailsTxt1 {
color: #ddd;
}
.crDeailsTxt2 {	
color: #BB191A;	
}

.cDetailImg {
margin: 5px 0px;
float: none; clear: both;
border: 1px solid #ccc;
}
#crBackToListBtn {
float: right;
margin-top: 50px;
margin-right: 10px;
background:url(../img/btn_backtolist01.gif) no-repeat;
width: 128px;
height: 39px;
text-indent: -3000px;/*invisible*/
}

/*Contact Page*/
#contactDes {
background: #DDD;
display: block;
border: solid 3px #000;
border-top: solid 20px #000;
border-bottom: dotted 5px #ccc;
width: 200px;
padding: 20px 50px; 
float: right;
}
.emailRightFloat, .emailRightFloat a, .emailRightFloat a:hover, .emailRightFloat a:active{
float: right;
color: #BB191A;
background:none;
text-decoration:none;
}
.emailRightFloat a:hover {
text-decoration:underline;
}

/*Bio Page*/
#bioDes {
background: #DDD;
display: block;
margin-right: 145px;
border-right: solid 3px #BB191A;
width: 280px;
padding: 30px 20px; 
float: right;
}

/**RESUME PAGE**/
/*->In a separate css*/