/* Colours */

body, a { color: #000000; }
em { color: #000000; }
em a { color: #000000; }
em.background { color: #000000; }

/*slideshow*/

/* overlay */
.cycle-slideshow, .cycle-slideshow * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.cycle-slideshow { width: 45%; min-width: 200px; max-width: 560px; padding: 0; position: relative;
    background: url(http://malsup.github.com/images/spinner.gif) 50% 50% no-repeat;
 }
 .cycle-slideshow img { 
    position: absolute; top: 0; left: 0;
    width: 100%; padding: 0; display: block;
}
.cycle-slideshow img:first-child {
    position: static; z-index: 100;
}

.cycle-overlay { 
    font-family: "Helvetica", helvetica, "Helvetica Neue", arial, sans-serif;
    position: absolute; bottom: 0; width: 100%; z-index: 600;
    background: black; color: white; padding: 5px; opacity: .8;
}

/* pager */
.cycle-pager { 
    text-align: right; width: 100%; z-index: 700; position: absolute; top: 0px; overflow: hidden; height:40px;
padding: 0px 5px 0px 0px;
}
.cycle-pager span { 
    font-family: arial; font-size: 50px; width: 16px; height: 16px; 
    display: inline-block; color: #ffffff; cursor: pointer; 
}
.cycle-pager span.cycle-pager-active { color: #ff0033;}
.cycle-pager > * { cursor: pointer;}

@media only screen and (max-width: 480px), only screen and (max-device-width: 480px) {
    .cycle-slideshow { width: 200px;}
    .cycle-overlay { padding: 4px }
    .cycle-caption { bottom: 4px; right: 4px }
}


/* Layout */

body { padding: 0px; text-align: left; }
div#container { margin: 0px auto; width: 840px; padding: 0px; text-align: left; 
}

.col { float: left; margin: 0px 0px 0px 0px;}
.col .col { margin: 0px; }

.one { width: 60px; }
.two { width: 105px; }
.three { width: 280px; }
.four { width: 300px; }
.five { width: 380px; }
.six { width: 460px; }
.seven { width: 540px; }
.eight { width: 620px; }
.nine { width: 680px; }
.ten { width: 780px; }
.eleven { width: 840px; }
.twelve { width: 940px; }

h1 em, h2 em { display: block; }
h4 em, h5 em { display: block;}


p, h2 { margin: 0px;}
hr { display: block; clear: both; margin: 0px; padding: 0px; height: 10px; overflow: hidden; visibility: hidden;}
a img { border: 0px; }


h2 { overflow: hidden; }
input#filter { display: inline; width: auto; padding: 0px 0px; border: 0px; background: #eee; font-size: inherit; color: inherit; }

div#content ul.project-list {margin-top: 15px; padding:0px; padding-top:10px; list-style: none; background-color:#E0E0E0;}
div#content ul.project-list li { padding: 0px 0px 0px 0px;  list-style:none;}
ul.project-list div.thumbnail p { padding:0px 10px 5px 10px;  list-style:none;}
ul.project-list div.thumbnail img {padding: 0px 10px 0px 0px;  list-style:none;}
ul.project-list div.summary { margin: 0px 0px 0px 0px; }
ul.project-list div.thumbnail a {border:0px}

h2.title, div#content, p.category, div#content ul.project-list li, div.description, p.para, div#images, div#media { padding: 0px; }
/*div#content ul.project-list li { border: 0px; padding: 0px; }*/
div#media { overflow: hidden; }
div.media { margin: 0px;}

div#content div.description { margin: 0px 0px 0px 0px; }
div.description div#media { margin: 0px 0px 0px 0px; border: 0px; padding: 0px; }




div.image{ margin-bottom:20px; }
div#content .image a { border:0px;}
div#content .image a:hover { border:0px;} 



div#content {margin: 0px 0px 0px 0px; padding: 20px 0px 0px 0px;}


.bottom { margin-bottom:40px;}



.right {text-align:right;}
.left {text-align:left;}

.border {border: 1px solid #c0c0c0;}

div#blank img {float:left;}


/*lightbox*/

#lightbox {
			position:fixed; /* keeps the lightbox window in the current viewport */
			top:0; 
			left:0; 
			width:100%; 
			height:100%; 
			background:url(../images/overlay.png) repeat; 
			text-align:center;
		}
		#lightbox p {
			text-align:right; 
			color:#fff; 
			margin-right:20px; 
			font-size:12px; 
		}
		#lightbox img {
			box-shadow:0 0 25px #111;
			-webkit-box-shadow:0 0 25px #111;
			-moz-box-shadow:0 0 25px #111;
			max-width:940px;
		}
		
/* Typography */

body, input { font-family: "Helvetica", helvetica, "Helvetica Neue", arial, sans-serif;  font-size: 16px; line-height:20px; }
ul li, p, em, li { font-size: 16px; font-style: normal; }
a { text-decoration: none; }

div#content p { font-size: 16px; }
div#content a {border-bottom: 1px solid #c0c0c0;}
div#content a:hover {border-bottom: 3px solid #000000;}

/*title*/
h1 { font-size: 20px; font-weight: bold; color:#ff0033; margin:0px; padding:0px;}

/*subtitle*/
h2 { font-size: 16px; font-weight: bold; color:#ff0033;}

/*name*/
h3 {font-size:35px; color:#000000; font-weight:bold; line-height:45px;}

/*nav*/
h4 a {font-size:20px; color:#000000; font-weight:bold; margin:0px 10px 0px 0px; padding:1px;}
h4 a:hover {background-color:#000000; color:#ffffff;}

h5 { font-size: 16px; font-weight: bold; color:#000000; margin:0px;}

h6 { font-size: 20px; font-weight: bold; color:#000000;}



/*project list*/
h7 {font-size:16px; color:#000000; font-weight:bold; border:0px;}
h7 a {color:#000000;padding:2px 2px 2px 0px; border:0px;}
h7 a:hover {background-color:#000000; color:#ffffff;}
div#content ul.project-list div.thumbnail a {margin: 5px 0px 0px 10px; border:0px;}




h1 a {color:#000000;padding:1px;}
h1 a:hover {background-color:#000000; color:#ffffff;}
h3 a {color:#000000;}
h3 a:hover {color:#E0E0E0;}

/*image captions*/
em.caption a {color:#999999; margin:0px; padding:0px; display:block;width:280px; border:0px;}


/*footer*/

p#footer { color: #BBB; margin: 30px 0px 30px 0px;font-size:14px }
p#footer em { display: block; }
p#footer a { color: #BBB;}
a.atom-rss { margin: 0px 0px 0px 6px; padding: 2px 3px 0px; font-size: 0.93em; letter-spacing: 0.08em; background: #E0E0E0; }