/* CSS Document */

#container {
	position:relative;
	width:860px;
	height:550px;
	border:1px solid #FF0000;
	margin-top: 20px;
	margin-bottom: 0;
	background-color: #000000;
	float: right;
	margin-right: 50px;
	background-image: url(../images/GDMM/gdmm_BG.jpg);
	background-repeat: no-repeat;
	background-position: 40px 40px;
    }
	/*if you add more images and need scroller make sure to change width to accomodate for the scroll bar*/
#container ul {
	list-style-type:none;
	float: right;
	width:205px;
	height:415px;
	overflow: auto;
	margin-top:10px;
	margin-right: 10px;
	margin-bottom: 3px;
	margin-left: 3px;
	border: 1px solid #FF0000;
	padding: 0;
    }
#container li {
    float:right;
	
    }	

#container a.gallery span {
	position:absolute;
	width:1px;/*make img pixel 1px by 1px to hide image, but will allow them to preload...see below*/
	height:1px;
	top:0px;/*this is where I can make to a minus so that dot will not show*/
	left:0px;
	overflow:hidden;
	visibility: visible;
	background-color: #000000;
    }
#container a.gallery, #container a.gallery:visited {
    display:block; 
    color:#000; 
    text-decoration:none; 
    border:1px solid #000; 
    margin:0px; 
    text-align:left; 
    cursor:default;
    }
	/*start of thumbnail style*/
	#container a.slideA1 {
	height:100px;
	width:100px;
	background-image: url(../images/GDMM/TN/TNflyerartlesson.jpg);
	background-repeat: no-repeat;
    }
#container a.slideA {
	height:100px;
	width:100px;
	background-image: url(../images/GDMM/TN/TNbusiness%20card%20gold%20frame%20w-M%20&%20N%20copy.jpg);
	background-repeat: no-repeat;
    }
#container a.slideB {
	height:100px;
	width:100px;
	background-image: url(../images/GDMM/TN/TNBusiness%20Card%20Horizonal.jpg);
	background-repeat: no-repeat;
    }
#container a.slideC {
	height:100px;
	width:100px;
	background-image: url(../images/GDMM/TN/TNBusiness%20Card%20red%20font%20copy.jpg);
	background-repeat: no-repeat;
    }
#container a.slideD {
	height:100px;
	width:100px;
	background-image: url(../images/GDMM/TN/TNBusiness%20card%20with%20all%20types%20%20copy.jpg);
	background-repeat: no-repeat;
    }
#container a.slideE {
	height:100px;
	width:100px;
	background-image: url(../images/GDMM/TN/TNbusiness%20cards%20small.jpg);
	background-repeat: no-repeat;
    }
#container a.slideF {
	height:100px;
	width:100px;
	background-image: url(../images/GDMM/TN/TNCurt%27s%20business%20card%201%20copy.jpg);
	background-repeat: no-repeat;
    }
	#container a.slideG {
	height:100px;
	width:100px;
	background-image: url(../images/GDMM/TN/TNCurt%27s%20business%20card%202%20copy.jpg);
	background-repeat: no-repeat;
    }
	#container a.slideH {
	height:100px;
	width:100px;
	background-image: url(../images/GDMM/TN/TNCurt%27s%20business%20card%203%20copy.jpg);
	background-repeat: no-repeat;
    }
	#container a.slideI {
	height:100px;
	width:100px;
	background-image: url(../images/GDMM/TN/TNhot%20rod%20business%20card%20copy.jpg);
	background-repeat: no-repeat;
    }		
	#container a.slideJ{
	height:100px;
	width:100px;
	background-image: url(../images/GDMM/TN/TNhot%20rod%20business%20card.jpg);
	background-repeat: no-repeat;
    }
	#container a.slideL {
	height:100px;
	width:100px;
	background-repeat: no-repeat;
	background-image: url(../images/GDMM/TN/TNLa%20Rana%20Business%20Card%202.jpg);
    }
	#container a.slideK{
	height:100px;
	width:100px;
	background-image: url(../images/GDMM/TN/TNjan%27s%20cards%20with%20edwardian%20font.jpg);
	background-repeat: no-repeat;
	
    }		
/*end of thumbnail style*/	


#container a.gallery:hover {
    border:1px solid #FF0000; 
    }
#container a.gallery:hover span {
	position:absolute;
	width:610px;
	height:510px;
	top:30px;
	left:20px;
	font-weight: normal;
	color: #FF0000;
	background-color: #000000;
    }
	

	
	
	
	
#container a.gallery:hover img {
    border:1px solid #FF0000; 
    float:left; 
    margin-right:5px;
    }

#container a.slideb:hover img, #container a.slidei:hover img {
    float:right;
    }

/*End of gallery style*/
