body { background:black;
       color: white;
       font-family: Verdana, Arial, sans-serif; 
  

#navBar {
    width: 25%;
    background-color: pink;
    position: absolute;
    right: 40px;
    top: 20px;
    border: solid;
   
}



}

#container { margin: auto;  
            width:80%;
            min-width:700px;
	   background-color:#34282C;
	   color:white;
	   border: 2px double #000000;
         
}
#logo{ border-bottom: 2px double #000000;
	  background-color:#302226;
       color:;     
       text-align:center;
}
#leftcolumn { float:left;
           background-color:black;
	      width:100px;
            padding-top:10px;
            
}

.navBar{ text-decoration:none;
	list-style-type:none;
        
}

a.navBar:link {color:white;
}
a.navBar:visited {color:red;
}
a.navBar:hover {color:red;
}


#rightcolumn { margin-left:150px;
       background-color:#302226;
	   color:purple;
	   padding:10px;
          

}


.floatright { padding-left:40px;
             float:right;
            
            
}

.floatleft { padding-left:40px;
             float:left;
            
            
            
}

}


.floatcenter { padding-left:40px;
             float:center;
          
            
}


#footer {border-top:2px double black;
          padding: 20px 0 20px 0; 
	background-color:black;
        color:pink;
        font-size: .60em;
        font-style: italic;
        text-align: center;
}


h3 {background-color:#ccaa66;
    padding-left:10px;
    padding-bottom: 5px;

    }

.content  { padding-left:20%;
            padding-right:20%; 
}

img {border:0; }

table { width:80%;
        margin:auto;
}
.altrow {background-color:#ccaa66;
}
td,th {padding:10px;
}

/* Bonus Style */
h3 { text-transform:uppercase;

color:#663300;
font-size:20px;
border-bottom:1px solid #000000;
margin-right:20px;
} 

.myRow {height:30px;
}
.mySubmit {margin:10px; 

}
.labelCol{float:left;
          width: 100px; 
          text-align: right;
          padding-right:10px;
} 
 


/* The containing box for the gallery. */
#container {
    position:relative;
    width:500px;
    height:400px;
    margin:20px auto 0 auto;
    border:1px solid #aaa;
    }

/* Removing the list bullets and indentation */
#container ul {
    padding:0;
    margin:0;
    list-style-type:none;
    }

/* Remove the images and text from sight */
#container a.gallery span {
    position:absolute;
    width:1px;
    height:1px;
    top:5px;
    left:5px;
    overflow:hidden;
    background:(graphics/gallery_back.jpg);
    }


/* Adding the thumbnail images */
#container a.gallery, #container a.gallery:visited {
    display:block;
    color:#000;
    text-decoration:none;
    border:1px solid #000;
    margin:1px 2px 1px 2px;
    text-align:left;
    cursor:default;
    }
#container a.slidea {
    background:url(gallery/minis/ratchetchristmasmini.jpg);
    height:93px;
    width:60px;
    }
#container a.slideb {
    background:url(gallery/minis/girlsofmini_2.jpg);
    height:93px;
    width:60px;
    }
#container a.slidec {
    background:url(gallery/minis/motaintmini.jpg);
    height:93px;
    width:60px;
    }
#container a.slided {
    background:url(gallery/minis/ratchetskimpmini.jpg);
    height:93px;
    width:60px;
    }
* html #container a.slided {
    height:93px;
    width:60px;
    }
#container a.slidee {
    background:url(gallery/minis/ornlacimini.jpg);
    height:93px;
    width:60px;
    }
#container a.slidef {
    background:url(gallery/minis/grownornmini.jpg);
    height:93px;
    width:60px;
    }
* html #container a.slidef {
    height:93px;
    width:60px;
    }
#container a.slideg {
    background:url(gallery/minis/youngorn2mini.jpg);
    height:93px;
    width:60px;
    }
#container a.slideh {
    background:url(gallery/minis/matlacimini.jpg);
    height:93px;
    width:60px;
    }
#container a.slidei {
    background:url(gallery/minis/thefactionmini.jpg);
    height:93px;
    width:60px;
    }
#container a.slidej {
    background:url(gallery/minis/romancemini.jpg);
    height:93px;
    width:60px;
    }
#container a.slidek {
    background:url(gallery/minis/ladyornmini.jpg);
    height:93px;
    width:60px;
    }
* html #container a.slidek {
    height:93px;
    width:60px;
    }
#container a.slidel {
    background:url(gallery/minis/peipeimini.jpg);
    height:93px;
    width:60px;
    }

#container a.slidem {
    background:url(gallery/minis/);
    height:93px;
    width:60px;
    }

#container a.sliden {
    background:url(gallery/minis/);
    height:93px;
    width:60px;
    }

/* set the size of the unordered list to neatly house the thumbnails */
#container ul {
    height:93px;
    width:60px;
    }
#container li {
    float:right;
    }


/* set the size of the unordered list to neatly house the thumbnails */
#container ul {
    width:198px;
    height:386px;
    }
#container li {
    float:right;
    }

/* move the thumbnails into the correct position */
#container ul {
    margin:5px;
    float:right;
    }

/* change the thumbnail border color */
#container a.gallery:hover {
    border:1px solid #fff;
    }

/* styling the :hover span */
#container a.gallery:hover span {
    position:absolute;
    width:372px;
    height:372px;
    top:10px;
    left:75px;
    color:#000;
    background:#fff;
    }

#container a.gallery:hover img {
    border:1px solid #fff;
    float:left;
    margin-right:5px;
    }          