/*************** Framework ***************/
body { font-family: helvetica; font-size:100%; background-color: #fff; color: #343434; min-width:900px; 
list-style-type: none;}

div#viewWrap {
	width:100%; /* width & height rules for Safari 3 */
	height:100%;
	margin:0 auto;
	text-align:left; /* To override the text-align:center rule for the body tag, which centers the page for IE */
}
div#pageWrap {width:950px;
    margin:0 auto;
   	background:#fff;
}

h1 {margin:0; font-size: 14px;}
h2 {font-size: 12px;}
h3 {font-size: 12px;}

a:link {  color: #343434;font-size: 11.5px; text-decoration: none; font-style: normal; font-weight: normal; }
a:visited {  color: #343434;font-size: 11.5px; text-decoration: none; font-style: normal; font-weight: normal; }
a:hover {  color: #fff; font-size: 11.5px;text-decoration: none; font-style: normal; font-weight: normal; background-color: #343434; }
a:active {color: #fff;font-size: 11.5px; text-decoration: none;font-style: normal;font-weight: normal;text-align: left; background-color: #343434;}

.current { font-weight: bold;} 

/** styling for addition pages **/

#about {line-height: 18px;width: 700px; font-size: 12px; min-height: 550px; text-align: justify;}
#cv { text-align:left; width: 600px; min-height: 550px;}
#tint { text-align:left; position:absolute; margin: 70px 400px;}
#tint_image {position:absolute; margin: 70px 60px;}
dt { min-height: 1.5em; /* to make sure it stays aligned if it's empty */
 float: left; clear: left; font-size: 12px;}
dd { min-height: 1.5em;margin-left: 75px; font-size: 12px;}

p {text-align:left; font-size: 12px;}
img { border: 0;}







div#topBar {float:right; width:950px; text-align: right;}
#logo {position: absolute; top: 50px; right: 50px;}
ul#topNav {position: absolute; top: 60px; right: 50px;}
ul#topNav li {display: inline; padding:10px 0 20px 20px;}


div#footer {position: absolute: bottom: 20px; left: 50px; }
div#footer p {text-align:left; font-size:10px; font-weight:normal; color:#666666; padding:20px 0;}

div#work{ min-width: 900px; margin: 110px 0; min-height: 450px;}
div#gallery {position: absolute; margin: 0 210px; width: 580px;}

ul#worklist  {position: absolute; list-style-type: none; width: 200px;  font-size: 13px; padding:0; margin: 65px 0;}
ul#worklist li {padding:10px; text-align: right;}
ul.description {position: absolute; width: 220px; list-style:none; font-size: 12px; line-height: 13px; margin: 65px 650px 10px;}

ul#stitched1 { float: left;  width:160px; margin:0 }
ul#stitched2 { float: left; width:160px;margin: 0 }
ul#stitched1 li {padding:30px 30px 20px; text-align:center;}
ul#stitched2 li {padding:30px 10px 20px; text-align:center;}

ul {list-style-type: none;}
ul#tint_line1 { float: left;  width:160px; margin:0; }
ul#tint_line2 { float: left; width:160px;margin: 0px 0px; }
ul#tint_line1 li {padding:5px 30px 20px; text-align:center;}
ul#tint_line2 li {padding:5px 10px 20px; text-align:center;}

ul.mangled {float:left; margin:0px; width: 370px;}
ul.mangled li {padding: 40px 40px 10px;}

ul.self {float:left; margin:0px; width: 370px;}
ul.self li {padding: 0px 40px 10px;}

ul.new {float:left; margin-top:0px; margin-left:0px; margin-right: 0px; margin-top: 0px; width: 370px;}
ul.new li {padding-top: 0px; padding-left: 40px; padding-right: 10px; padding-bottom: 0px; }





/*************** helper classes ***************/
*.floatLeft {float:left; display:inline;}
*.floatRight {float:right;}
*.clear:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}/* Hack for float clearing - add this class to the parent container surrounding the floats to be cleared */
*.clearBoth {clear:both;}
*.clearLeft {clear:left;}
*.clearRight {clear:right;}

*.static {position:static;}
*.relative {position:relative;}

*.center {text-align:center;}
*.left {text-align:left;}
*.right {text-align:right;}
*.top {vertical-align:top;}
*.middle {vertical-align:middle;}
*.bottom {vertical-align:bottom;}

*.bold {font-weight:bold;}
*.italic {font-style:italic;}

*.hr {margin:5px auto; border-top:none; border-bottom:1px solid #eee9d4;}
*.hr hr {display:none;}/* These two hr rules make for cross-browser consistent hr display - use <div class="hr"><hr /></div> */


	.overlay {
	display:none; 
	z-index:10000; 
	background-color:#fff;
	min-height:300px;
	border:0px solid #666; 
	-moz-box-shadow:0 0 90px 5px #000; 
	-webkit-box-shadow: 0 0 90px #000;     
	-moz-border-radius:3px;
	-webkit-border-radius:3px;	
} 

.overlay .close {
	background-image:url(images/close.png); 
	position:absolute; 
	left:-15px; 
	top:-15px; 
	cursor:pointer; 
	height:36px; 
	width:36px; 
}



/*************** jQuery Tools - overlay-gallery.css ***************/

/* "next image" and "prev image" links */
.next, .prev {
	/* absolute positioning relative to the overlay */
	position:absolute;
	top:30%;	
	border:1px solid #666;	
	cursor:pointer;
	display:block;
	padding:10px 20px;
	color:#666;
	font-size:11px;
	/* upcoming CSS3 features */
	-moz-border-radius:5px;
	-webkit-border-radius:5px;	
}

.prev {
	left:0;
	border-left:0;
	-moz-border-radius-topleft:0;
	-moz-border-radius-bottomleft:0;
	-webkit-border-bottom-left-radius:0;
	-webkit-border-top-left-radius:0;
}

.next {
	right:0;
	border-right:0;
	-moz-border-radius-topright:0;
	-moz-border-radius-bottomright:0;
	-webkit-border-bottom-right-radius:0;
	-webkit-border-top-right-radius:0;	
}

.next:hover, .prev:hover {
	text-decoration:underline;
	background-color:#000;
}

/* when there is no next or previous link available this class is added */
.disabled {
	visibility:hidden;		
}

/* the "information box" */
.info {
	position:absolute;
	bottom:0;
	left:auto;	
	padding:10px 15px;
	color:#666;
	font-size:11px;
	border-top:1px solid #666;
}

.info strong {
	font-size:15px;
	font-weight:normal;
	display:block;	
}

/* progress indicator (animated gif). should be initially hidden */
.progress {
	position:absolute;
	top:45%;
	left:50%;
	display:none;
}

/* everybody should know about RGBA colors. */
.next, .prev, .info {
	background:#ddd !important;
	background:rgba(0, 0, 0, 0.6) url(images/h80.png) repeat-x;		
}