/* Portfolio Graphic CSS Document */
#porlogo .graphic {float:left;}
.graphic {margin:30px 1px 0 0 ; width:310px; height:171px; height:auto;}

.graphic ul.gallery, 
.graphic ul.gallery{display:none;}

.graphic ul.gallery
{display:block; position:absolute; left:0; list-style:none; padding:0; margin:0; width:576px;  z-index:1;}

.graphic ul.gallery2, 
.graphic ul.gallery{display:block; position:static; left:0; list-style:none; padding:0; margin:0; z-index:100; width:310px; height:auto;}

.graphic ul.gallery li
{display:inline; width:154px; height:166px;}

.graphic ul.gallery li a
{display:block; width:310px; height:171px; cursor:default; text-decoration:none; border:none;}

.graphic h6 {
background-color:#000000;
padding:4px;
color:#FFFFFF;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
font-weight:normal;
margin:0 0 2px;
text-transform:uppercase;
}
.graphic:hover h6 {
background-color:#BB2222;
}
#porlogo img {
margin:0;
}
#porlogo {
clear:both;
}

.graphic ul.gallery li a img
{display:block; width:308px; height:170px; border:1px solid #d0d0d0;}

.graphic ul.gallery li a:hover, 
.graphic ul.gallery li a:hover 
{white-space:normal; position:relative;}

.graphic ul.gallery li a:hover img, 
.graphic ul.gallery li a:hover img 
{position:absolute; left:0px; top:0px; width:576px; height:318px; border:2px solid #000000;}

.graphic ul.gallery2 div.brdr {
	border:1px solid #d0d0d0;
	height:170px;
}
.graphic ul.gallery2 li
{display:inline; width:100px; height:54px; padding:0px; margin:1px; float:left;}

.graphic ul.gallery2 li a
{display:block; cursor:default; text-decoration:none; border:none;}

.graphic ul.gallery2 li a img
{display:block; width:100px; height:54px; border:0px solid #d0d0d0;}

.graphic ul.gallery2 li a:hover, 
.graphic ul.gallery2 li a:hover 
{white-space:normal; position:relative;}

.graphic ul.gallery2 li a:hover img, 
.graphic ul.gallery2 li a:hover img 
{position:absolute; left:0px; top:0px; width:576px; height:318px; border:2px solid #000000;}

/*********************
**** VERTICAL LONG **/
#porlogo .graphicvl {float:left;}
.graphicvl {margin:30px 1px 0 0 ; width:310px; height:171px; height:auto;}

.graphicvl ul.gallery, 
.graphicvl ul.gallery{display:none;}

.graphicvl ul.gallery
{display:block; position:absolute; left:0; list-style:none; padding:0; margin:0; width:576px;  z-index:1;}

.graphicvl ul.gallery, 
.graphicvl ul.gallery{display:block; position:static; left:0; list-style:none; padding:0; margin:0; z-index:100; width:310px; height:auto;}

.graphicvl ul.gallery li
{display:inline; width:154px; height:166px;}

.graphicvl ul.gallery li a
{display:block; width:310px; height:171px; cursor:default; text-decoration:none; border:none;}

.graphicvl h6 {
background-color:#000000;
padding:4px;
color:#FFFFFF;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
font-weight:normal;
margin:0 0 2px;
text-transform:uppercase;
}
.graphicvl:hover h6 {
background-color:#BB2222;
}
#porlogo img {
margin:0;
}
#porlogo {
clear:both;
}

.graphicvl ul.gallery li a img
{display:block; width:308px; height:170px; border:1px solid #d0d0d0;}

.graphicvl ul.gallery li a:hover, 
.graphicvl ul.gallery li a:hover 
{white-space:normal; position:relative;}

.graphicvl ul.gallery li a:hover img, 
.graphicvl ul.gallery li a:hover img 
{position:absolute; left:0px; top:0px; width:513px; height:428px; border:2px solid #000000;}

/*********************
**** SINGLE GRAPHIC **/
#porlogo .graphics {float:left;}
.graphics {margin:30px 1px 0 0 ; width:310px; height:171px; height:auto;}

.graphics ul.gallery, 
.graphics ul.gallery{display:none;}

.graphics ul.gallery
{display:block; position:absolute; left:0; list-style:none; padding:0; margin:0; width:576px;  z-index:1;}

.graphics ul.gallery, 
.graphics ul.gallery{display:block; position:static; left:0; list-style:none; padding:0; margin:0; z-index:100; width:310px; height:auto;}

.graphics ul.gallery li
{display:inline; width:154px; height:166px;}

.graphics ul.gallery li a
{display:block; width:310px; height:171px; cursor:default; text-decoration:none; border:none;}

.graphics h6 {
background-color:#000000;
padding:4px;
color:#FFFFFF;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
font-weight:normal;
margin:0 0 2px;
text-transform:uppercase;
}
.graphics:hover h6 {
background-color:#BB2222;
}
#porlogo img {
margin:0;
}
#porlogo {
clear:both;
}

.graphics ul.gallery li a img
{display:block; width:308px; height:170px; border:1px solid #d0d0d0;}

.graphics ul.gallery li a:hover, 
.graphics ul.gallery li a:hover 
{white-space:normal; position:relative;}

.graphics ul.gallery li a:hover img, 
.graphics ul.gallery li a:hover img 
{position:absolute; left:0px; top:0px; width:471px; height:319px; border:2px solid #000000;}

/*********************
**** Double Small **/
#porlogo .graphicds {float:left;}
.graphicds {margin:30px 1px 0 0 ; width:310px; height:171px; height:auto;}

.graphicds ul.gallery, 
.graphicds ul.gallery{display:none;}

.graphicds ul.gallery
{display:block; position:absolute; left:0; list-style:none; padding:0; margin:0; width:576px;  z-index:1;}

.graphicds ul.gallery, 
.graphicds ul.gallery{display:block; position:static; left:0; list-style:none; padding:0; margin:0; z-index:100; width:310px; height:auto;}

.graphicds ul.gallery li
{display:inline; width:154px; height:166px;}

.graphicds ul.gallery li a
{display:block; width:310px; height:171px; cursor:default; text-decoration:none; border:none;}

.graphicds h6 {
background-color:#000000;
padding:4px;
color:#FFFFFF;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
font-weight:normal;
margin:0 0 2px;
text-transform:uppercase;
}
.graphicds:hover h6 {
background-color:#BB2222;
}
#porlogo img {
margin:0;
}
#porlogo {
clear:both;
}

.graphicds ul.gallery li a img
{display:block; width:308px; height:170px; border:1px solid #d0d0d0;}

.graphicds ul.gallery li a:hover, 
.graphicds ul.gallery li a:hover 
{white-space:normal; position:relative;}

.graphicds ul.gallery li a:hover img, 
.graphicds ul.gallery li a:hover img 
{position:absolute; left:0px; top:0px; width:471px; height:319px; border:2px solid #000000;}