body {
	background: #fff;
	font-family: "Open Sans", "Open Sans Web", "Droid Sans", "Segoe UI", "Ubuntu", sans-serif;
	line-height:1.4;
	color: #000;
	min-width: 320px;
    max-width: 908px;
	margin-left:auto;
	margin-right:auto;
	-webkit-font-smoothing: subpixel-antialiased;
	}
	
@media (max-width: 400px) {
	span.project { font-size: 1em!important; }
	#logo h1 {
		font-size:1.25em!important;
		font-size:5.7vw!important;
	}
	h1 { font-size: 1.4em!important; }
	h2 { font-size: 1.2em!important; }
}


@media (min-width: 401px) and (max-width: 630px) {
	#logo h1 {
		font-size:1.58em!important;
		font-size:5.8vw!important;
		line-height:1.4em!important;
	}
}
	
h1, h2, h3, h4, h5, h6 {
	font-family: "TeX Gyre Adventor", "TeXGyreAdventor", "Tex Gyre Adventor Web", "ITC Avant Garde Gothic",  "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
	font-weight:300;
	text-align: left;
	color:black;
}

h1 { font-size: 2em; }
#logo h1 {
	display:inline;
	line-height:1.3em;
	font-size: 2.25em;
	font-weight: normal;
	padding-left:2px;
	padding-right:2px;
	font-weight: 300;
	color:black;
}
h2 {
	display: inline;
	font-size: 1.5em;
}
h3 { font-size: 1.25em; }


A		{ text-decoration:none; color: #3f5cbf;	}
A:visited	{ text-decoration:none;	}
A:active, A:hover { text-decoration:none; border-bottom:1px solid #3f5cbf; color: #3f5cbf; }
a:hover.slider, a:active.slider {
	border:0;
}

a.minibadge {
	display: inline-block;
	color: black;
	margin:20px;
	height:130px;
	width:200px;
}

span.minibadge {
	display:inline-block!important;
	padding:-20px!important;
	height:inherit;
	width:inherit;
	background-repeat:no-repeat!important;
}

.minibadge p {
	display:block;
	font-weight:normal!important;
	background-color:white;
	padding: 0px 11px 0px 11px!important;
	margin-top:8px;
	margin-bottom:48px;
	margin-right:-8px;
	text-align:left!important;
	float:right;
	margin-left:20px;
/*	visibility:hidden; */
}

.minibadge-label-left {
	margin-left:-8px!important;
	float:left!important;
	margin-right:20px!important;
}

a.minibadge:hover {
	margin:12px;
	border: 8px solid #3f5cbf;
}

a.project {
display:inline-block;
color: black;
margin:20px;
height:262px;
}


a.project:hover {
margin: 12px;
border: 8px solid #3f5cbf;
}


span.project {
font-size: 1.2em;
display:inline-block!important;
padding:-20px!important;
height:inherit;
background-size:cover;
background-repeat:no-repeat!important;
max-width:392px;
min-width:200px;
width:100%;
}

.project p {
display:block;
background-color:white;
margin-top:4%;
margin-bottom:4%;
text-align:left!important;
}

p.project-element-left {
padding: 0px 3px 0px 11px;
margin-left:-8px;
float:left;
margin-right:110px;
}

p.project-element-right {
padding: 0px 11px 0px 3px;
margin-right:-8px;
float:right;
margin-left:110px;
}

/*

#element1 { top: 10%; }
#element2 { top: 35%; }
#element3 { top: 60%; }
#element4 { top: 85%; }

*/

.workcategory {
	display:inline-block;
	margin:2%;
	padding:0;
	max-width:400px;
	min-width:200px;
	width:96%;
	vertical-align:top;
}

.workcategory h2 {
	padding-top:3em;
}

span.worktype {
	display:inline-block!important;
	padding:3px!important;
	margin:10px!important;
	vertical-align:top;
}

.worktype li {
	margin:1em;
	text-align:left;
}

.worktype h3 {
	margin: 0.5em;
}

.worktype p {
	text-align: left;
}

#worktype1 {
	background-color: #f9bbe8;
}

#worktype2 {
	background-color: #f9eabb;
}

#worktype3 {
	background-color: #bbc9f9;
}

#worktype4 {
	background-color: #bbf9cb;
}


hr {
	border:0;
	height:1px;
	color:black;
	background-color:black;
	margin:2px;
}

IMG {
	border: none;
	margin: 1em;
}

#main IMG {
	width:92%;
	max-width:400px;
	min-width:200px;
}

#logo IMG {
	margin:0;
	margin-bottom:-10px;
	align: left;
}

TD.weber { font-size: 0.8em; }

LI.mono { font-size: 1.0em; }

.slide {
	display:inline-block!important;
	background-repeat:no-repeat!important;
	position:relative;
	padding:8px;
	margin-bottom: 2em;
}

.caption {
	display:block;
	width:90%;
	padding:5%;
	padding-top:8px;
	text-align:left;
}

.slider {
	position:absolute;
	width:50%;
	display:inline-block;
	height: 100%;
	z-index:2;
	opacity:0;
	background:url('trans1x1.png');
}

.slider:hover {
	text-decoration:none;
	opacity:1.0!important;
}

#slider-left {
	top:0px;
	left:0px;
}

#slider-right {
	top:0px;
	right:0px;
}

.label {
	display:inline-block;
	background-color:white;
	margin-top:50%;
	font-size:1.25em;
	color:black;
}

.slider:hover .label {
	display:block;
	background-color:white;
	margin-top:50%;
	font-size:1.25em;
	color:black;
}

#label-left {
	padding: 0px 11px 0px 11px;
	text-align:left;
	float:left;
}

#label-right {
	padding: 0px 11px 0px 11px;
	text-align:right;
	float:right;
}

#logo {
	line-height:1.25em;
	text-align: left;
    display: block;
	position: relative;
    margin-left: auto;
    margin-right: auto;
	margin-bottom: 30px;
	letter-spacing:0.01em;
/*	font-family: "TeX Gyre Adventor", "TeXGyreAdventor"; */
	font-variant:small-caps;
}

#logo span {
	font-size:0.8em;
	line-height:1em;
	padding-left:2px;
	padding-right:2px;
}

#projectlist{
    text-align: center;
    display: inline-block;
	position: relative;
    margin-left: auto;
    margin-right: auto;
	margin-top: 10px;
	}
	
#gallery{
	text-align: center;
}

#gallery p {
	text-align:left!important;
}

#gallery li {
	text-align:left!important;
}

#gallery img {
	max-width:800px;
	width:100%;
	height:auto;
	margin:0px;
}
	
LI {
	list-style-position: outside;
	clear: left;
	margin-top: 0.67em;
}

.header {
        font-size: 0.8em;/
        font-weight: bold;
        }

.menu	{
	padding:6px;
	text-align: right;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.menu h2 { font-weight:300; }
	
.navigation-link {
	margin-right:0;
	margin-left:40px;
	margin-top:2em;
	margin-bottom:2em;
}

.navigation-title {
	display:block;
	margin-right:300px;
	margin-top:0px;
	margin-bottom:0px;
	text-align:left;
}

#main	{
	text-align: left;
	display: block;
	position: relative;
	margin-left: auto;
	margin-right: auto;
#	width: 908px;
	padding: 6px;
	font-size: 14px;
}

.constrain p { max-width: 466px; }
.constrain ul { max-width:426px; }

.text-block {
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
}

#main p {
	text-align:left;
}

#menu2	{
	margin-top: 12px;
	margin-bottom:20px;
}

#menu2 h1 {
	display:none;
}