/*  
Theme Name: Squash Stylesheet
Description: The yellow theme for Christopher Cheng's portfolio
Version: 1
Author: Christopher Cheng
*/

* {
  margin: 0;
  padding: 0;
}
/* -- Clear Fix -- */
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix {display: inline-table;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

/* -- Float Buster -- */
.float-buster {clear: both; height: 0; line-height: 0;}

/* add strikethrough to colorize menu */

#sliderContainer{	width:810px;
	margin:0px auto;
	text-align:right;}

#sliderExample {
float:right;
	text-align:left;
	margin-top:40px;
	margin-bottom:2px;
	font:normal 9px Lucida Grande, Verdana, Arial, Helvetica;
}

div.sliderBucket {
	position: absolute;
	margin-left: 52px;	
}

.slideOpener {	
	text-decoration:none;
	color: #666666;
}

.slideOpener:hover {	
		color: #c1bf0e;
}

#sliderExample ul li {
	text-align:left;
	padding: 5px 0px 0px 5px;		
}

#sliderExample ul li a {
	color: #666666;		
	text-decoration:none;
}

#sliderExample ul li a:hover {
		color: #999999;		
		text-decoration:none;
}

.see_squash{
	text-decoration: line-through;		
	color: #999999;
}

body {
	background:#FFFFFF url(../images/bg_stripe.jpg);;
	margin:0px auto;
	padding:0px;
	
}


#container {
	width:810px;
	margin:0px auto;
	text-align:center;
}

#content {
	float:left;
	width:805px;
	height:545px;
}


#home {
	float:left;
	width:507px;
	height:496px;
	background:url(../images/s-home.jpg);
}

.awesome {
	text-align:right;
	margin:45px 19px 0px 0px;
	padding:0px;
	font:normal 10px Lucida Grande, Verdana, Arial, Helvetica;
	color:#eff7de;
	letter-spacing:0px;
}


/* menu bar */

#menu {
	float:left;
	background:#C1490E;
	width:298px;
	height:74px;
	text-align:left;
	color:#c1bf0e;
	font-size:9pt;
}

#menu ul {
	margin:45px 0px 0px 19px;
	padding:0px;
}

#menu li {display:inline;}

#menu li a {
	color:#eff7de;
	font:normal 9px Lucida Grande, Verdana, Arial, Helvetica;
	text-decoration:none;	
}

#menu li a:hover {color:#c1bf0e;}

/* menu bar end */

#top {	
	float:left;
	width:805px;
	height:5px;
	background:url(../images/top.jpg);
	font-size:0px;

}

#color {	
	float:left;
	width:5px;
	height:545px;
	background:url(../images/s-color.jpg);
}

#home_right {	
	float:left;
	background:#C1490E;
	width:298px;
	height:422px;
	background:url(../images/s-h.jpg);

}

#about_right {	
	float:left;
	width:298px;
	height:422px;
	background:#C1490E url(../images/s-a.jpg) bottom no-repeat;
}

#footer {	
	float:left;
	width:805px;
	height:44px;
	background:url(../images/s-footer.jpg);
}

/**  about start  **/
.knowhow {
	text-align:right;
	margin:40px 25px 0px 25px;
	padding:0px;
	font:normal 11px Verdana, Arial, Helvetica;
	color:#eff7de;
	line-height:18px;
	
}

.skills {
	text-align:center;
	margin:10px 0px 0px 0px;
	padding:0px;
	font:normal 11px Lucida Grande, Verdana, Arial, Helvetica;
	color:#eff7de;
	line-height:15px;
}

.skills_column {
	text-align:right;
	float:right;
	width:20%;
	margin:23px 25px 0px 10px;
}

.skills_column li {display:block;}

.things {
	text-align:left;
	margin:20px 25px 0px 25px;
	padding:0px;
	font:normal 10px Lucida Grande, Verdana, Arial, Helvetica;
	color:#eff7de;
	line-height:18px;
}

#about {
	float:left;
	width:507px;
	height:496px;
	background:url(../images/s-about.jpg);
}


.knowhow h1 {
	font:normal 15px Georgia, Lucida Bright, Times New Roman;
	color:#DEDB16;
	padding-bottom:8px;
	font-variant:small-caps;
}

.skills h2 {
	font:normal 15px Georgia, Lucida Bright, Times New Roman;
	color:#DEDB16;
	padding-bottom:8px;	
	font-variant:small-caps;

}

.things h3 {	
	font:normal 20px Georgia, Lucida Bright, Times New Roman;
	color:#DEDB16;
	padding-bottom:7px;
}
/**  about end  **/

/**  contact start  **/

#contact {
	float:left;
	width:507px;
	height:496px;
	background:url(../images/s-contact.jpg);
}

.theform {
	text-align:right;
	margin:40px 25px 0px 25px;
	padding:0px;
	font:normal 11px Verdana, Arial, Helvetica;
	color:#eff7de;
	line-height:18px;
	
}

.theform li {display:block;}

label {

	float: left;
	text-align: right;
	margin-right: 0.5em;
}

.submit input {
	margin-left: 4.5em;
}
ul li {
list-style: none;
}
input, textarea,SELECT, OPTION {
	color: #333333;
	padding:2px;
	background-color:#eff7de;
	border: 2px solid #DEDB16;
	margin-bottom:8px
}

.submit input {
	font:normal 11px Verdana, Arial, Helvetica;
	color: #202520;
	background: #DEDB16;
	border: 2px outset #DEDB16;
}

fieldset { border: none; }

.things a {
	color:#DEDB16;
	text-decoration:none;	
}

.things a:hover {
	color:#eff7de;
	text-decoration:underline;	
}

.thanks {
	float:right;
	text-align:right;
	margin:0px 0px 0px 0px;
	padding:0px;
	font:normal 11px Verdana, Arial, Helvetica;
	color:#eff7de;
	line-height:18px;
	width:250px;
	
}


.thanks h1 {
	font:normal 15px Georgia, Lucida Bright, Times New Roman;
	color:#DEDB16;
	padding-bottom:8px;
	font-variant:small-caps;
}

/**  contact end  **/

/**  portfolio start  **/

#port_top {
	float:left;
	background:url(../images/s-p-top.jpg);
	width:507px;
	height:74px;
}

#port_bott {
	float:left;
	width:507px;
	height:422px;
	background-color:202520;
		font-size:0px;

}


.port_bott a {
	color:#ffffff;
	text-decoration:none;	
}

.port_bott a:hover {
	color:#4dae19;
	text-decoration:underline;	
}

.stretchtoggle{
	
	font:normal 15px Georgia, Lucida Bright, Times New Roman;
	color:#333333;
	padding-top:6px;
}

.site {
	text-align:left;
	margin:0px 25px 0px 25px;
	padding:0px;
	font:normal 10px Lucida Grande, Verdana, Arial, Helvetica;
	color:#eff7de;
	line-height:15px
}

.site a {
	color:#DEDB16;
	text-decoration:none;	
}

.site a:hover {
	color:#eff7de;
	text-decoration:underline;	
}

.stretcher a {
	color:#eff7de;
	text-decoration:none;	
}

.stretcher a:hover {
	color:#DEDB16;
	text-decoration:underline;	
}

.site h1 {
	font:normal 12px Georgia, Lucida Bright, Times New Roman;
	color:#eff7de;
	padding:9px 0px 1px 0px;
	font-variant:small-caps;
}

/**  portfolio end  **/