/* --- GLOBAL --- */


@font-face {
	font-family: Arial, sans-serif;
}


body
{
font-family: Arial, sans-serif;
text-align: center;
}

a
{
	color: inherit;
	text-decoration: none;
}

a:hover
{
	text-decoration: underline;
}

p
{
padding: 0 0 10px 0;
text-align: left;
}

section#portfolio
{
/* width: 1680px; */
margin: 0 auto;
text-align: center;
}

aside
{
color: white;
text-align: center;
background: #bbbbaa;
padding: 5px;
width: 90%;
max-width: 1440px;
margin: 0 auto 20px auto;
}

aside a
{
	text-decoration: none;
}

aside a:hover
{
	text-decoration: underline;
}


header
{
text-align: center;
line-height: normal;
padding: 35px 0 25px 0;
/*width: 1630px;*/
width: 85%;
max-width: 1440px;
margin: 0 auto;
}

header a
{
	text-decoration: none;
}

header a:hover
{
text-decoration: underline;
}

@media only screen and (max-width: 1680px) {
	section#portfolio {width: 1440px;}
}

@media only screen and (max-width: 1440px) {
	section#portfolio {width: 1200px;}
}

@media only screen and (max-width: 1200px) {
	section#portfolio {width: 960px;}
}

@media only screen and (max-width: 960px) {
	section#portfolio {width: 720px;}
}

@media only screen and (max-width: 720px) {
	section#portfolio {width: 480px;}
	}

@media only screen and (max-width: 479px) {
	section#portfolio {width: 95%;}
	}

.nobreak
{	
	white-space: nowrap;
}

section#portfolio ul li
{
text-align: center;
width: 200px;
margin: 20px;
display: inline-block; 
vertical-align: top;
zoom: 1;	/* --- IE FIX --- */
*display: inline;	/* --- IE FIX --- */
}

@media only screen and (max-width: 479px) {
	section#portfolio ul li {margin: 10px 0; width: 100%;}
}

section#portfolio ul li img
{
width: 100%;
padding: 0 0 10px 0;
}

section#portfolio ul li .note
{
font-size: 12px;
color: #BFC1C1;
}

/* --- BACK BUTTON --- */

a#back
{
display: block;
width: 80%;
max-width: 300px;
margin: 20px auto;
}

a#back img
{
width:100%;
}

/* --- HEADER --- */

header a#insignia
{
display: block;
margin: 0 auto;
max-width: 420px;
min-width: 260px;
width: 40%;
}


header img
{
width: 100%;
padding: 0 0 5px 0;

}

header h1
{
font-size: 2.375em;
line-height: 36px;
color: #555A5B;
padding: 0 0 5px 0;
}

@media only screen and (max-width: 479px) {
	header h1 {font-size: 1.750em; line-height: 26px;}
	}

header h2
{
color: #6E7272;
}

header ul li
{
font-size: 1.250em;
color: #555A5B;
display: inline-block;
zoom: 1;	/* --- IE FIX --- */
*display: inline;	/* --- IE FIX --- */
}



header ul li:after
{ 
content:" \00b7 ";
}

header ul li:last-child:after
{ 
content:"";
}

@media only screen and (max-width: 479px) {
	header ul li {font-size: 1.000em;}
	}


footer
{
background: #bbbbaa;
color: black;
text-align: center;
width: 100%;
margin: 30px 0 0 0;
padding: 35px 0;
}

footer p
{
text-align: center;
margin: 15px 35px 15px 35px;
}

footer p a
{
text-decoration: underline;
}

footer p a:hover
{
text-decoration: none;
}

footer ul li
{
font-size: 1.625em;
display: inline-block;
padding: 2px;
zoom: 1;	/* --- IE FIX --- */
*display: inline;	/* --- IE FIX --- */
}

footer ul li:after
{ 
content:" \00b7 ";
}

footer ul li:last-child:after
{ 
content:"";
}