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

#prod_disp_gal_main
{
width:500px;



}
#prod_disp_gallery
{
width:500px;
position:relative;
}


#prod_disp_gallery ul
{

list-style:none;
padding:0px;
width:56px;
top:5px;
margin:5px 0px;
height:300px;
overflow-y:scroll;


}

#prod_disp_gallery:hover ul
{
background-color:#000;
}


#prod_disp_gallery ul li
{
list-style:none;
display:inline;
background-color:#000;

height:36px;
}

#prod_disp_gallery ul li a

{

text-decoration:none;
visibility:hidden;
-webkit-transition-duration:0.5s;
opacity:0;
padding:0px 0 0px 0;
display:block;
overflow:hidden;
width:55px;
}

#prod_disp_gallery ul li a img

{
position:relative;
padding:2px 3px 0px 3px;
border:0px;
z-index:500;

}

#prod_disp_gallery:hover a

{
opacity:1;
overflow:hidden;
visibility:visible;
} 

#prod_disp_gallery ul li a b

{
position:absolute;
left:-9999px;
display:block;

width:400px;
height:300px;

} 

#prod_disp_gallery ul li a:hover b

{
position:absolute;
left:0;
top:5px;

} 

#prod_disp_gallery ul li a b img

{
width:400px;
height:auto;

}

#prod_disp_gallery ul li a:hover b img
{
width:400px;
height:auto;


}

#prod_disp_gallery ul li c

{
position:absolute;
left:-9999px;
display:block;

width:200px;

background-color:#000000;
visibility:hidden;
}

#prod_disp_gallery ul li a:hover c
{
position:absolute;
left:59px;
top:5px;
z-index:100;
padding:7px;
visibility:visible;
background-color:#FFFFFF;
border:solid;
border-width:3px;
border-color:#000;
border-radius: 5px;
-webkit-box-shadow: 7px 7px 5px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    7px 7px 5px 0px rgba(50, 50, 50, 0.75);
box-shadow:         7px 7px 5px 0px rgba(50, 50, 50, 0.75);
}

.static {
margin:5px 0 0 8px; 
background-color:#333333; 
padding:4px;	
float:left; 
width:400px;
border-radius: 3px;
-webkit-box-shadow: 7px 7px 5px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    7px 7px 5px 0px rgba(50, 50, 50, 0.75);
box-shadow:
}

.content {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color:#000;
	line-height:11.5px;
}

#hint {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color:#000;
	line-height:11.5px;
	margin-left:10px;
	margin-top:10px;
}

#thelist {
	left:405px;
	top:-10px;
	position:absolute;
	z-index:200;
}

#skillslist {
	margin-left:10px;
}

#thumbnail {
	width:415px; 
	height:315px; 
	background-color:#FFF;
	left:-420px;
	position:absolute;
}

#rotate img {
max-width:100%;	
}

#slideshow { 
     
    position: relative; 
    width: 375px; 
	
    height: 240px; 
    padding: 10px; 
	-webkit-box-shadow: 0 0 20px rgba(0,0,0,0.4);
	-moz-box-shadow: 0 0 20px rgba(0,0,0,0.4);
    box-shadow: 0 0 20px rgba(0,0,0,0.4); 
	border-radius: 3px;
}

@media screen and(max-width: 320px) {
	 #slideshow { 
		 
		position: relative; 
		width: 275px; 
		-webkit-box-shadow: 0 0 0 rgba(0,0,0,0.4);
	-moz-box-shadow: 0 0 0 rgba(0,0,0,0.4);
    box-shadow: 0 0 0 rgba(0,0,0,0.4); 
		 
		padding: 0px; 
		
		border-radius: 3px;
	}
	#prod_disp_gal_main {
		width:300px;
		overflow:hidden;
	}
	#hint {
		display:none;
	}
}

#slideshow > div { 
    position: absolute; 
    top: 10px; 
    left: 10px; 
    right: 10px; 
    bottom: 10px; 
}