@charset "utf-8";
/* CSS Document */

/* color palette (lightest to darkest)
Teals
T1 #e3f1f2
T2 #d3e7e9
T3 #99c8cb
T4 #397174
Browns
B1 #d7d4d3
B2 #998675
B3 #736357
B4 #534741
B5 #362f2d

/* RESET */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;'
	
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
    footer, header, hgroup, menu, nav, section {
    display: block;
    }
body {
    line-height: 1;
    }
ol, ul {
    list-style: none;
    }
blockquote, q {
    quotes: none;
    }
blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
    }



/* General Content */
#home {
	background-image: url(../Images/layout/homebg.jpg);
	background-repeat: repeat-x;
	}

/* Header Styling */
#header {
	background-color: #FFF;
	background-image: url(../Images/layout/headerbg.jpg);
	background-repeat: repeat-x;
	border-bottom-width: thin;
	border-bottom-style: solid;
	border-bottom-color: #99c8cb;
	width: 100%;
	height: 48px;
	position: fixed;
	padding-top: 8px;
}

#nav {
	border: thin dashed #d7d4d3;
	background-color: #FFF;
	font-family: Verdana, Geneva, sans-serif;
	color: #99c8cb;
	font-size: 14pt;
	display: inline-block;
}

#nav li{
	display: inline-block;
	padding: 8px;
	line-height: 100%;
}

#nav li:hover{
	color: #FFF;
	background-color:#d7d4d3;
}

#nav li a {
	color: #99c8cb;
	text-decoration: none;
	}

#nav li a:hover{
	color: #FFF;
	background-image: url(../Images/layout/navhoverarrow.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	padding-bottom: 16px;
}


.navbugs {
	display: inline;
	}

.navbugs a{
	height: 25px;
	width: 25px;
	display: inline-block;
	}

.alignleft {
float: left;
}
.alignright {
float: right;
}


/* Content Styling */
#content {	
padding-top: 100px;
}
.wrapped {width: 1000px; margin: 0 auto;}
.wrapped2 {width: 940px; margin: 0 auto;}


h1 {
	color: #397174;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 22pt;
	font-weight: lighter;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #998675;
	padding-bottom: 10px;
	margin-bottom: 25px;
	padding-top: 20px;
}

.arrow{
	background-image: url(../Images/layout/arrow.gif);
	background-repeat: no-repeat;
	background-position: right bottom;
	height: 10px;
	margin-top: -46px;
	margin-bottom: 25px;
}

.arrow2{
	background-image: url(../Images/layout/arrow2.gif);
	background-repeat: no-repeat;
	background-position: right bottom;
	height: 10px;
	margin-top: -46px;
	margin-bottom: 25px;
}

h2 {
	color: #534741;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18pt;
	font-weight: lighter;
	padding-left: 30px;
	}
	
h3 {}

p, li{
	line-height: 150%;
	padding-top: 15px;
	font-family: Georgia, "Times New Roman", Times, serif;
}


#quote1 {
}

a {
	color: #73B4B7;
	text-decoration: none;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: normal;
}
a:hover{
	color: #C7B39A;
}






/* Portfolio */

#portfolio {
	background-color: #e3f1f2;
	border-top-width: 2px;
	border-bottom-width: 2px;
	border-top-style: dashed;
	border-bottom-style: dashed;
	border-top-color: #99c8cb;
	border-bottom-color: #99c8cb;
	margin-top: 40px;
	margin-bottom: 20px;
	padding-top: 20px;
	padding-bottom: 20px;
}

#portfolio img {
	border: thin solid #397174;
	margin: 4px;
}

#portfolio img:hover{
border: thin solid #99c8cb;
}


#portfolio h1 {
	color: #397174;
	padding-top: 5px;
}


.visible{}

.collapsible{

}

h1.visible {
	border:none;
	margin-bottom: 0;
	
}
h1.visible a {
	background-color: #99c8cb;
	color: #fff;
	text-decoration: none;
	font-family: Verdana, Geneva, sans-serif;
	display: block;
	text-align: center;
	padding-top: 5px;
	padding-bottom: 5px;
}

h1.visible a:hover {
	background-color: #998675;
}


#skills, #about{
	padding-right: 30px;
	padding-left: 30px;
}

.link li, .collapsible li {
	display: inline;
}



/* ABOUT ME and WHAT I DO */
#about, #skills, #contact {
	margin-bottom: 40px;
	clear: both;
}
#about img{
	float: right;
	padding-left: 30px;
}

#skills {}

#icando h2, #passion h2 {
	padding-left: 0;}

#icando{
	width: 65%;
	padding-top: 10px;
}

#icando ul, #passion ul{
	padding-top: 15px;
}

#icando ul li{
	float: left;
	background-image: url(../Images/layout/check.png);
	background-repeat: no-repeat;
	width: 270px;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 30px;
}

#passion {
	float: right;
	width: 30%;
	padding-top: 10px;
	border-left-width: 2px;
	border-left-style: dashed;
	border-left-color: #99C8CB;
	padding-left: 30px;
	padding-bottom: 10%;
}

#passion ul{}

#passion ul li{
	display: inline;
	padding-right: 20px;
}


#contact{

}

#contact h2 a {
	font-family: Arial, Helvetica, sans-serif;
	color: #397174;
	text-decoration: none;
}

#contact h2 a:hover {
	color: #534741;
	
}

#wrapup {
	width: 600px;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding: 50px;
}

#wrapup a {
	color: #372F2D;
	font-size: 30px;
	background-image: url(../Images/layout/email.png);
	background-repeat: no-repeat;
	border: 2px dashed #99C8CB;
	padding-top: 20px;
	padding-right: 40px;
	padding-bottom: 25px;
	padding-left: 160px;
	background-position: 5px 5px;
}


#wrapup a:hover {
	color: #372F2D;
	font-size: 30px;
	background-image: url(../Images/layout/email.png);
	background-repeat: no-repeat;
	border: 2px dashed #3A7174;
	background-color: #e3f1f2;
}




/* extra layout elements */
#aboutsmooth, #contactsmooth {
	padding-top: 50px;
}









/* Sosumi Copyright Styling */
#sosumi {
	background-color: #99C8CB;
	color: #FFF;
	padding-bottom: 10px;
	padding-top: 10px;
	text-align: right;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
}

#sosumi a{
	color: #FFF;
}

#sosumi a:hover{
	color: #397174;
}

#sosumi p{
	margin: 0px;
	padding: 0px;
}

#sosumi ul {}

#sosumi ul li{
	display: inline;	

}