body {
	BACKGROUND: #090909 url(images/bg4.jpg) top center repeat-x;
	FONT-SIZE: 12px;
	FONT-FAMILY: Century Gothic, Arial,Sans-Serif;
	COLOR:#f8f8ff;
	MARGIN:0px;
	TEXT-ALIGN: center;
}
#content {
	TEXT-ALIGN: left;
	VERTICAL-ALIGN: middle;
	MARGIN: 0px auto;
	PADDING: 30px;
	WIDTH: 960px;
}
p, h1, pre {
	MARGIN: 0px;
	PADDING: 5px 10px;
}
h1 {
	FONT-SIZE: 11px;
	TEXT-TRANSFORM:uppercase;
	TEXT-ALIGN: right;
	COLOR: #564b47;
	background-color: #90897a;
}
a {
	COLOR: #ACACAC;
	BACKGROUND-COLOR:transparent;
	TEXT-DECORATION: underline;
}                             

pre {
	COLOR: #564b47;
	FONT-SIZE: 11px;
	BACKGROUND-COLOR:transparent;
	FONT-FAMILY: Century Gothic, Arial,Sans-Serif;
}

#logo{
	WIDTH:295px;
	HEIGHT:90px;
	DISPLAY:block;
	BACKGROUND-IMAGE: url(images/riclogo.png);
	BACKGROUND-POSITION:0px 0px;
        CURSOR: pointer;
        MARGIN: 10px 0px 0px 32px;
        Z-INDEX: 10; 
        POSITION: RELATIVE;
        FLOAT: left
}

#logo:hover,#about:active { background-position:0px -100px; }

#header {
	BACKGROUND:transparent url(images/header.png) top left no-repeat;
	MARGIN: 0px 0px 10px 10px;
	WIDTH:700px;
	HEIGHT:120px;
	FLOAT:left;
}

#line {
	CLEAR:both;
	BACKGROUND:transparent url(images/line.png) top center no-repeat;
	MARGIN: 40px 0px 0px 0px;
	WIDTH:960px;
	HEIGHT:20px;
}

a:link img{BORDER-STYLE: none;}
a:vlink img{BORDER-STYLE: none;}
a:alink img{BORDER-STYLE: none;}
a:visited img{BORDER-STYLE: none;}

#websites {
	BORDER: #fff 0px dotted;
	CLEAR:both;
        BACKGROUND:transparent url(images/websites.png) top center no-repeat;
	HEIGHT: 50px;
	WIDTH: 250px;
        MARGIN: 10px 0px 0px 20px;
}

#logos {
	BORDER: #fff 0px dotted;
        BACKGROUND:transparent url(images/logos.png) top center no-repeat;
	HEIGHT: 50px;
	WIDTH: 250px;
        MARGIN: 10px 0px 0px 20px;
}

#portfolio1 {
	MARGIN: 40px 0 0px 0;
}

	#portfolio1 ul {
		LIST-STYLE: none; /* Remove the bullet points from the list */
	}
		#portfolio1 ul li {
			FLOAT: left; /* Float the lists to the left, laying them out side by side */
			PADDING: 10px; MARGIN: 0 23px 23px 0;
			BACKGROUND: url(images/back.png) no-repeat; /* Add the semi-transparent background, used along with padding to give the impression of a see-through border */
		}

#nav {
	BORDER: #000 0px dotted;
	PADDING: 0px;
	FLOAT: right;
        MARGIN: 38px 64px 6px 0px;
        POSITION: relative;
}

#email{
	FLOAT: left;
	MARGIN: -56px 0px 0px 254px;
	WIDTH:200px;
	HEIGHT:80px;
	TEXT-INDENT:-9999px;
	TEXT-DECORATION:none;
	DISPLAY:block;
	Z-INDEX: 4;
}

#phone{
	FLOAT: left;
	MARGIN: -59px 0px 0px 0px;
	WIDTH:130px;
	HEIGHT:80px;
	TEXT-INDENT:-9999px;
	TEXT-DECORATION:none;
	DISPLAY:block;
	Z-INDEX: 4;
}

#portfolio{
	FLOAT: left;
	MARGIN: -27px 0px 0px 0px;
	WIDTH:100px;
	HEIGHT:100px;
	TEXT-INDENT:-9999px;
	TEXT-DECORATION:none;
	DISPLAY:block;
	BACKGROUND-IMAGE:url(images/portfolio_1.png);
	BACKGROUND-POSITION:0px 0px;
	Z-INDEX: 4;
}
#portfolio:hover,#portfolio:active {background-position:0 -110px; Z-INDEX: 4; }

#portfolionav{
	FLOAT: left;
	MARGIN: -27px 0px 0px 0px;
	WIDTH:100px;
	HEIGHT:100px;
	TEXT-INDENT:-9999px;
	TEXT-DECORATION:none;
	DISPLAY:block;
	BACKGROUND-IMAGE:url(images/portfolio_active.png);
	BACKGROUND-POSITION:0px 0px;
	Z-INDEX: 2;
}

#about{
	FLOAT: left;
	MARGIN: -27px 10px 0px 7px;
	WIDTH:100px;
	HEIGHT:100px;
	TEXT-INDENT:-9999px;
	TEXT-DECORATION:none;
	DISPLAY:block;
	BACKGROUND-IMAGE:url(images/about_1.png);
	BACKGROUND-POSITION:0px 0px;
	Z-INDEX: 2;
}
#about:hover,#about:active { background-position:0 -110px; Z-INDEX: 2; }

#aboutnav{
	FLOAT: left;
	MARGIN: -27px 10px 0px 7px;
	WIDTH:100px;
	HEIGHT:100px;
	TEXT-INDENT:-9999px;
	TEXT-DECORATION:none;
	DISPLAY:block;
	BACKGROUND-IMAGE:url(images/about_active.png);
	BACKGROUND-POSITION:0px 0px;
	Z-INDEX: 2;
}

#contact{
	FLOAT: left;
	MARGIN: -27px 0px 0px -4px;
	WIDTH:100px;
	HEIGHT:100px;
	TEXT-INDENT:-9999px;
	TEXT-DECORATION:none;
	DISPLAY:block;
	BACKGROUND-IMAGE:url(images/contact_1.png);
	BACKGROUND-POSITION:0px 0px;
	Z-INDEX: 2;
}
#contact:hover,#contact:active {BACKGROUND-POSITION:0 -110px; Z-INDEX: 2;}

#contactnav{
	FLOAT: left;
	MARGIN: -27px 0px 0px -4px;
	WIDTH:100px;
	HEIGHT:100px;
	TEXT-INDENT:-9999px;
	TEXT-DECORATION:none;
	DISPLAY:block;
	BACKGROUND-IMAGE:url(images/contact_active.png);
	BACKGROUND-POSITION:0px 0px;
	Z-INDEX: 2;
}

.button,li,form,img,#container,#portfolio,#about,#contact,#portfolionav,#logo,#header,#line,#contactnav,#aboutnav,#logos,#websites,#footer {BEHAVIOR: url(iepngfix.htc) }

/* A handy 'Clearfix' technique to clear floats in order to avoid affecting page elements further down the document */
.clear:after {
	content: "";
	display: block; visibility: hidden; clear: both;
}
	.clear { zoom: 1; } /* Clearfix IE fix */

legend{COLOR: #acacac; PADDING: 4px;}

#or {
        PADDING: 45px 0px 0px 0px;
        FLOAT: left;
}

#contactdetails {
        PADDING: 186px 0px 0px 22px;
        FLOAT: left;
        WIDTH: 260px;
}

form {
        CLEAR:both;
        WIDTH: 450px;
        HEIGHT: 605px;
        PADDING: 20px auto;
        FLOAT: left;
}

fieldset {
        BORDER:0px solid #666;
}

input, textarea {
	BORDER:1px solid #666;
	FONT-SIZE:1em;
	FONT-FAMILY: Century Gothic, Arial,Sans-Serif;
	PADDING:4px;
        WIDTH:390px;
	BACKGROUND:#fff;
}

input:focus, input:hover,textarea:focus, textarea:hover{
	BORDER: 1px solid #666;
	BACKGROUND:#f9f9f9;
}

label {
}

input {
	WIDTH:390px;
}

#title {
        FONT-SIZE:1.2em;
}

.button, .button:hover {
        BACKGROUND: transparent url(images/submit.png) no-repeat;
	COLOR:#fff;
	FONT-WEIGHT:bold;
        WIDTH: 50px;
        HEIGHT: 40px;
        BORDER:0px solid #666666;
        CURSOR: pointer;	
}

#aboutme {
        CLEAR:both;
        WIDTH:590px;
        MARGIN: 30px auto;
	FONT-SIZE:1em;
        LINE-HEIGHT:18px;
}

#aboutmeinner{
        WIDTH:250px;
        FLOAT: left;
        MARGIN:0px 70px 0px 0px;
        TEXT-ALIGN:left;
}

#skills{
        WIDTH:270px;
        TEXT-ALIGN:left;
        FONT-SIZE:1em;
        LINE-HEIGHT:18px;
        FLOAT: left;
}

#reviews{
        WIDTH:580px;
        FLOAT: left;
        PADDING: 40px 0px 20px 0px;
}

#message{
        CLEAR:both;
        HEIGHT:400px;
        MARGIN:0px auto;
        TEXT-ALIGN:center;
}

#footer {
        CLEAR: both;
        MARGIN: 0px auto;
        MARGIN-TOP: 30px;
        HEIGHT: 65px;
        TEXT-ALIGN: center;
        LINE-HEIGHT: 65px;
}

#imageData #caption {
	FONT-FAMILY: Century Gothic, Arial,Sans-Serif;
        font-size: 15px;
        font-weight: bold;
        line-height: 20px;
}

html {OVERFLOW-Y: scroll;}
