﻿body{font: 16px Verdana,Arial,sans-serif; color:#FFF; background-color:#000}
div.main{width:1000px; height:auto; background-color:#CC0000; margin:0px auto; top:20px;}
#header{width:100%; height:auto;}
#leftcolumn{width:250px; float:left}
#rightcolumn{float:right; width:750px}
#offers hr{width:40%;float:left}
#lowermenu{font: normal 10px Verdana,Arial,sans-serif; text-align:center; width: 100%}
.clear{clear:both}
#openinghours{text-align:right; width:200px}
#openinghours h4{text-align: center}
.contentslideshow {border: none;}
.kids-slideshow {float:right; padding-left:7px; padding-bottom:7px;}
.leftcolumncontent{width:225px; padding:5px; background:#42424B}
.pagename{width:740px; background:#42424B; padding:5px; text-align:center}

div.logo{width:225px;}
div.headercontent{width:770px}
div.headercontent img{float:left}
div.introleft, div.introright{width:305px; height:270px}
div.introleft, div.introright{color:#005999}
div.introleft, div.introright, div.logo{background:#FFF;}
div.introleft, div.introright, div.main{padding:10px;}
div.logo{padding:5px;}
div.appointmentleft, div.appointmentright{color:#FFF; width:45%}
div.introleft, div.contactleft, div.appointmentleft, div.logo{float:left}
div.introright, div.contactright, div.appointmentright, img.small, div.headercontent{float:right}
div.contactleft{width:30%}
div.contactright{width:70%}
div.splitter, div.directions, div#header, div.pricelist{width:100%}
div.splitter{height:10px}
img.small{border:0}
h1{font:lighter 150% "Trebuchet MS",Arial sans-serif; color:#FFF}

.verticalsplitter, div.frame{float:left}
.verticalsplitter{height:15px; width:10px}

div.frame{width:155px; height:160px; padding:10px; color:#005999; background:#FFF} 
div.frame a{font-family:arial,sans-serif;font-size:11px; color:#4D4D4D;font-weight:bold;text-decoration:none;}
div.frame img{ width:140px; height:120px}
div.frame, div.frame p{text-align:center}


/*NAVIGATION*/

/*TOP MENU BAR*/
div.navigation{margin:0px auto; width:100%;height:45px;}
ul#topnav{margin: 10px 0 10px 0px; list-style:none; font-size:1.0em;}
ul#topnav li{margin:0; overflow:hidden; height:40px;}
ul#topnav li, ul#topnav{padding:0}
ul#topnav a, ul#topnav li, ul#topnav span{float:left}
ul#topnav, ul#topnav a, ul#topnav span{clear:both}
ul#topnav a, ul#topnav span {padding:10px 20px; text-decoration:none; text-transform:uppercase; height:20px; line-height:20px; background:#000}
ul#topnav a, ul#topnav span {color:#FFF}
ul#topnav span{display:none}
ul#topnav.v2 span{background-color:#000}
ul#topnav.v2 a{color:#000; background-color:#FFF}

/*SIDE MENU*/
.sidemenu{width:200px;}
.sidemenu ul{list-style-type:none; margin:0; padding:0; margin-bottom:0}
.sidemenu ul li{padding-bottom:2px; width:100%}
.sidemenu ul li a{font: normal 12px Verdana,Arial,sans-serif; color:white; background:black; display:block; padding:5px 0; line-height:17px; padding-left:8px; text-decoration:none}
.sidemenu ul li a:visited{color:white}
.sidemenu ul li a:hover{color:black; background:white}	

#slider { background: white url(../images/style/slider-bg.jpg); height: 228px; overflow: hidden; position: relative; margin: 50px 0; }
								  
                                /* DEFAULT is for three panels in width, adjust as needed
                                   This only matters if JS is OFF, otherwise JS sets this. */								  
#mover { width: 2880px; position: relative; }

.slide { padding: 40px 30px; width: 900px; float: left; position: relative; }
.slide h1 { font-family: Helvetica, Sans-Serif; font-size: 20px; letter-spacing: -1px; color: #ac0000; }
.slide p						{ color: #000; font-size: 12px; line-height: 22px; width: 300px; }
.slide img						{ height:190px; position: absolute; top: 20px; left: 400px; }
#slider-stopper					{ position: absolute; top: 1px; right: 20px; background: #ac0000; color: white;
								  padding: 3px 8px; font-size: 10px; text-transform: uppercase; z-index: 1000; }			  

/* Album List */
div#albums 
{
	background-color:#000;
    width: 180px;
}
div#albums h2 {
    font-size: 1.0em;
}  

div#albums h2, ul#albums_list a 
{
	color:#FFF;
} 
 
ul#albums_list {
    list-style-type: none;    
}    

#albums a:active , #albums a:visited, #albums a:link{
    color: #CC0000;
    text-decoration: none;
}

ul#albums_list a:hover{
    font-weight: bold;    
}

ul#albums_list li.selected {
    font-weight: bold;
    padding: 5px 0 5px 15px;
    width: 230px;
    margin: 5px 0 5px -15px;
}

ul#albums_list li.selected, div#gallery
{
	background-color:#FFF;
}

* html ul#albums_list li.selected {
    background: #032020;
}

* html ul#albums_list li.selected, ul#albums_list, ul#gallery_list {
	padding: 0;
    margin: 0;
}

div.toolbar, div#albums, ul#gallery_list li, .padding {
    padding: 10px;
}

.clear {
    clear: both;
} 

/* Gallery */
div#gallery {
    width: 540px;   
} 

div#gallery h2 {
    font-size: 3em;
}  
  
ul#gallery_list {
    list-style-type: none;    
}

ul#gallery_list li {
    width: 160px;
    height: 160px;
}     

ul#gallery_list li a img {
    padding: 5px;
    background: #282E2E;
    border: 1px solid #3D5252;
}    
ul#gallery_list li a:hover img {
    border: 1px solid #CC0000;
    background: #CC0000;
}    

div.toolbar {
    border-bottom: 1px solid #282E2E; 
}

div.toolbar, div#gallery h2, div#gallery p {
	color:#000;
}

div.toolbar #albumTitle, div.toolbar #pagerTop, div.toolbar #albumNumPhotos {
	display: block;
	width: 225px;
}

div#albums, div#gallery, div.toolbar #albumTitle, div.toolbar #pagerTop, ul#gallery_list li {
    float: left;
}

div.toolbar #pagerTop, ul#gallery_list li {
    text-align: center;
}

div.toolbar #albumNumPhotos {
    text-align: right;
    float: right;
}             


/*Nifty Layout*/
ul.lenses,ul.lenses li, ul.priced-items,ul.priced-items li{list-style-type:none;margin:0;padding:0;text-align:center;}
ul.lenses,ul.priced-items{width:100%;overflow:hidden;margin-bottom:20px}
ul.lenses li,ul.priced-items li{float:left;width:140px;margin-right:10px;padding: 10px 0}
li.lens-type, li.lens-type-end, li.priced-item, li.priced-item-end{background: #98bf21}
ul.lenses li.lens-type-end, ul.priced-items li.priced-item-end{margin-right:0;}
ul.lenses p,ul.lenses h3, ul.priced-items p,ul.priced-items h3{margin:0;padding: 0 10px}
ul.lenses p, ul.priced-items p{font-size:0.75em}
ul.lenses h3, ul.priced-items h3{text-transform:uppercase;padding-bottom:3px;color: #FFF; font-size:0.8em}
li.lens-type a, li.lens-type-end a, li.priced-item a, li.priced-item-end a{color:#42424B}

li.lens-type-gray, li.lens-type-end-gray, li.priced-item-gray, li.priced-item-end-gray{background: #42424B}

.minipics ul{list-style-type: none;margin:0 0px;padding:0}
.minipics li{float:left;width:175px;margin: 5px 5px 5px 0;background-color: #FFF}
.minipics li img{display: block;width: 159px;height: 140px;margin:5px 8px;border: 0px}

