﻿/********************************************
   AUTHOR:          http://www.ambitiouswebdesign.com 
   WEBSITE:     http://www.apothecarytulsa.com/
   TEMPLATE NAME:  The Apothecary Shoppe
   DATE:           Mar-28th-2009
 *******************************************/ 
 
/********************************************
   HTML ELEMENTS
********************************************/ 
 
* { margin: 0; padding: 0px; }

html, body { 
margin: 0;
padding: 0px;
height: 100%; 
background: #000 url(/images/bg.jpg) repeat-x; /* Main DIV Background Img */
} 


.line { border: none; border-bottom: 1px solid #4e5b28; height: 0px; margin: 0 auto }
.clear { clear: both; }

/* ----------CART--------------------- */

font, table, tr, td { border: none; background-color: transparent;}
table, td, tr { border: none; font: 8pt verdana, Sans-Serif; color: #000; }
td { line-height: 17px; }
table b { color: #000; }
table a, tr a, td a, font a, .content table a {color: #e1e1e1; font: 9pt verdana, Sans-Serif; }
table a:hover, tr a:hover, td a:hover, font a:hover, .content table a:hover {color: #ee4591;}
table hr {border: none; border-bottom: 1px solid #000; height: 0px;}
font img { border: 0px; margin-right: 10px; }

.cartbutton {
width: 0px;
}


/* ----------Centered Container Or the Layout--------------------- */

#container { 
min-height: 100%; 
height: auto !important; 
height: 100%; 
margin: 0 auto -4em; /* make sure this matches in the body footer DIV */

} 


/* --------------LABELS BUTTONS & FORMS-----------*/
 
label {
color: #830017;
font: bold 8pt verdana;
margin-bottom: 10px;
color: #000;
}
 
.form, textarea  {
width: 20em;
border: 1px solid #777;
font: 8pt verdana, Sans-Serif;
color: #111;
padding: 2px;
margin-bottom: 20px;
}
 
.button {
width: 6em;
font: bold 14px 'courier new' courier;
color: #fff;      
background: #7b0000;
padding: 7px;
border: 1px solid #7b0000;
cursor: pointer
}

/* --------------HEADER------------- */

#header {
height: 161px;
width: 980px;
margin: 0 auto;
}

#header .logo{
float: left;
width: 440px;
text-align: left;
}


#header .links{
float: right;
width: 540px;
text-align: right;
}

#header img{
border: 0px;
}



/* --------------LOGO IN HEADER *always use this*------------- */

.logolink, #swap { width: 442px; height: 161px;}
.logolink { background-image: url('/images/logo.gif'); background-repeat: no-repeat;}
.logolink a { float: left;  }
 
#swap { background-image: url(/images/logo.gif); }
 
.rollover { display: block; } /* Allow setting widths and heights */
.rollover img { width: 100%; height: 100%; border: 0; } /* only set width and height once */
.rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
.rollover:hover img { visibility: hidden; } /* 'rolls over' the image */




/* --------------IMAGE ROTATOR------------- */
#rtr {
width: 631px;
height: 319px;
background: url(/images/holder.jpg) no-repeat;
padding: 19px 0px 0px 17px;
}




/* --------------MAIN CONTENT, LEFT NAVIGATION----------------*/

#main {
min-height: 100%; 
height: auto !important; 
height: 100%; 
background: #FFF url(/images/mainbg.gif) repeat-y; /* Main DIV Background Img */
width: 912px;
margin: 0 auto;
margin-top: 25px;
}

#main .content {
padding: 0px;
margin: 0px;
margin-left: 255px;
margin-right: 0px;
min-height: 580px; 
height: auto !important; 
height: 100%; 
width: 631px;
}

#main .left {
padding: 0px;
margin: 0px;
width: 300px;
float: left;
height: auto !important; 
height: 100%; 

}

#main .right {
padding: 0px;
margin: 0px 0px 0px 31px;
width: 300px;
float: right;
height: auto !important; 
height: 100%; 

}

#main h1 {
color: #830017;
font: bold 18pt 'courier new' courier;
text-transform: uppercase; 
}

#main p {
color: #000;
font: 8pt verdana, Sans-Serif;
padding: 0px 20px 20px 15px;
clear: right;
}



#main a {
color: #7a7e08;
text-decoration: underline;
}

#main .bold10 {
color: #000;
font: bold 10pt verdana, Sans-Serif;
}


#main ul.bullet{
padding: 5px 15px 15px 15px;
margin-left: 15px;
}

#main .bullet li{
background: url(/images/bullet.gif) no-repeat;
padding-left: 20px;
list-style-type: none;
display: block;
padding-bottom: 5px;
padding-top: 0px;
color: #000;
font: 8pt verdana, Sans-Serif;
}

.bullet li a{
color: #7a7e08;
text-decoration: underline;
font: 8pt verdana, Sans-Serif;
padding-top: 7px;
padding-bottom: 7px;
}

.bullet li a:hover{ /*hover state CSS*/
color: #7a7e08;
}

#navleft {
float:left; 
width: 209px;
margin-left: 29px;
padding: 0px;
background: #FFF url(/images/leftnavbg.gif) repeat-y; /* Main DIV Background Img */
z-index: 99;

}


#main .top {
width: 912px;
height: 61px;
background: url('/images/maintop.gif') repeat-x;
}

#main .bottom {
width: 912px;
height: 61px;
background: url('/images/mainbottom.gif') repeat-x bottom;
}

#main .pageheader {
color: #830017;
font: bold 18pt 'courier new' courier;
text-transform: uppercase; 
clear: right;
padding: 0px 0px 20px 0px;
}

#main .note {
color: #830017;
font: bold 10pt 'courier new' courier;
}



#main .information {
clear: right;
padding: 0px 0px 20px 0px;
background: url('/images/information.gif') no-repeat;
height: 72px;
}


/* --------------STAFF------------- */
#staff img, .location { margin: 4px; border: 1px solid #bfc09c; padding: 5px;}

.staffinfo { color: #111; font: 11px 'Lucida Sans Unicode', Sans-Serif;}
.staffinfo img { float: right; margin: 4px 4px 4px 24px; border: 1px solid #bfc09c; padding: 5px;}
.staffinfo .staffhead { color: #830017; font: bold 18px 'courier new' courier; text-transform: uppercase; clear: right; padding: 0px 0px 20px 0px;}


/* --------------HOMEPAGE------------- */

#homeflash{
width: 625px;

}

#homebody{
width: 625px;
height: auto;
height: 100%;
clear: right;
}

#homebody .left{
width: 300px;
float: left;

}

#homevideo{
width: 300px;
float: left;
}


#homebody .right{
background: url('/images/hours.jpg') no-repeat;
width: 293px;
float: right;
height: auto;
height: 100%;

}


#homenews {
height: auto;
height: 100%;
background: url('/images/newsbg.jpg') repeat-y;
width: 293px;
height: auto;
min-height: 220px;
font: 'Lucida Sans Unicode', sans-serif;
margin-top: 60px;
}


#homenews .item{
width: 293px;
margin-bottom: 10px;
clear: both;
background: url('/images/newsbg.jpg') repeat-y;
height: auto;

}

#homenews .date{
width: 60px;
color: #fff;
float: left;
margin: 0px 10px 10px 15px;
font: 9pt 'Lucida Sans Unicode', sans-serif;

}

#homenews .info{
width: 200px;
color: #fff;
float: right;
margin: 0px 5px 10px 0px;
font: 9pt 'Lucida Sans Unicode', sans-serif;
}

#homenews .headline{
font: bold 9pt 'Lucida Sans Unicode', sans-serif;
}


#homenews a{
color: #d99c00;
font: bold 9pt 'Lucida Sans Unicode', sans-serif;
}

#homenews .hours{
width: 293px;
color: #e7e2b8;
float: left;
margin: 0px 5px 10px 15px;
font: 9pt 'Lucida Sans Unicode', sans-serif;
}

#homenews .highlight{
color: #fbc838;
}


/* --------------FOOTER------------- */

#footer, .push { 
clear: both;
height: 4em; /* make sure this matches in the body container DIV */
bottom: 0;
left: 0;
margin: 0 auto; 
position: relative;
} 

#footer {
background-color: #000;
height: auto;
}

#footer .content { 
margin: 0 auto; 
position: relative; 
text-align: center;
width: 912px;
color: #665f22;
font: 8pt 'Lucida Sans Unicode', Sans-Serif;

}


/* --------------FOOTER LINKS------------- */

#footer ul { padding: 10px;}
#footer .links ul { margin: 0px; padding: 0px;}

#footer .links li {
display: inline;
list-style-type: none;
}

#footer .links li a {
color: #9d6b03;
text-decoration: none;
border-right: 1px solid;
padding: 0px 10px 0px 10px;
font: 10pt 'courier new' courier;
}

#footer .links li a:hover { text-decoration: underline; }


/* --------ASC LINKS--------- */

#footer .asc ul { margin: 0px; padding: 0px;}

#footer .asc li a {
color: #47442e;
text-decoration: none;
padding: 0px 10px 0px 10px;
font: 7pt 'Lucida Sans Unicode', Sans-Serif;
}


#footer .asc li {
color: #47442e;
text-decoration: none;
padding: 0px 10px 0px 10px;
font: 7pt 'Lucida Sans Unicode', Sans-Serif;
list-style-type: none;
}



/* --------------FOOTER SEO LINKS------------- */


#footer .seo {
height: auto;
text-align: left;
min-height: 100px;
width: 850px;
color: #484845;
font: 8pt 'Lucida Sans Unicode', Sans-Serif;

}
 

#footer .seo a {
color: #484845;
text-decoration: none;
font: 8pt 'Lucida Sans Unicode', Sans-Serif;
}



/* ----- NAVIGATION BAR ---------- */
#suckerdiv ul{
list-style-type: none;
margin: 0;
padding: 0px 0px 0px 12px;
width: 182px;
z-index: 99;
}
	
#suckerdiv ul li{
position: relative;
padding: 2px 0px 3px 0px;
background: url(/images/navsepbg.gif) no-repeat bottom;
z-index: 99;
}

#suckerdiv ul li a{
overflow: auto; /*force hasLayout in IE7 */
color: #000;
background: url(/images/navArrow.gif) no-repeat center left; /*custom bullet list image*/
display: block;
text-decoration: none;
font: bold 9pt 'courier new' courier;
padding: 5px 0px 5px 3px;
z-index: 99;
}

#suckerdiv ul li .active{ /*hover state CSS*/
color: #fff;
background-image:url('/images/navrollover.jpg');
z-index: 99;
}

#suckerdiv ul li a:visited{
color: #000;
z-index: 99;
}

#suckerdiv ul li a:hover{
color: #fff;
background-image:url('/images/navrollover.jpg');
z-index: 99;
}

	
/*Sub level menu items */
#suckerdiv ul li ul{
position: absolute;
width: 177px; /*sub menu width*/
top: 0;
visibility: hidden;
border: 1px solid #fff;
background: #cd8015;
padding: 0px;
z-index: 99;
}





#suckerdiv ul li ul li {
background: #cd8015;
padding: 0px;
border-bottom: 1px #fff solid;
z-index: 99;

}

#suckerdiv ul li ul a {
color: #fff;
background: #cd8015;
padding: 5px;
z-index: 5;
}

#suckerdiv ul li ul a:hover {
color: #fff;
text-decoration: underline;
background: #89162d;
z-index: 5;
}

#suckerdiv ul li ul a:visited {
color: #fff;
z-index: 5;
}


.suckerdiv .subfolderstyle ul li a {
background-color: #424242
z-index: 5;
}
	

	
/* Holly Hack for IE \*/
* html .suckerdiv ul li { float: left; height: 1%; }
* html .suckerdiv ul li a { height: 1%; }
/* End */


#askapharmacist {
}

#askapharmacist .question{
color: #7a7e08;
font: bold 10pt 'Lucida Sans Unicode', Sans-Serif;
text-decoration: underline;
}

#askapharmacist a{
color: #7a7e08;
font: bold 10pt 'Lucida Sans Unicode', Sans-Serif;
text-decoration: underline;
margin-bottom: 5px;
}


#askapharmacist ul{
padding: 5px 15px 15px 15px;
margin-left: 15px;
}

#askapharmacist li{
list-style-type: none;
display: block;
color: #7a7e08;
font: 10px 'Lucida Sans Unicode', Sans-Serif;
margin-bottom: 15px;
padding-left: 18px;
background: url(/images/iconbullet.gif) no-repeat top left;
}


#askapharmacist li a{
color: #7a7e08;
font: bold 10pt 'Lucida Sans Unicode', Sans-Serif;
text-decoration: underline;
margin-bottom: 5px;
}

#askapharmacist li a:hover{ /*hover state CSS*/
color: #7a7e08;
}

#askapharmacist .2celltable{
padding: 5px;

}

#askapharmacist .2celltable td{
width: 50%;
padding: 5px;
}


#2celltable{
padding: 5px;

}

#2elltable td{
width: 50%;
padding: 5px;
}


#seminar{
}

#seminar .title{
color: #7a7e08;
font: bold 10pt 'Lucida Sans Unicode', Sans-Serif;

}

#seminar .details{
margin: 8px;
}




#updates {
background: url('/images/updatesbg.gif') repeat-x;
width: 625px;
font: 10pt 'Lucida Sans Unicode', sans-serif;
margin-top: 15px
}

#updates td{
padding: 10px;
}

.error{
	font-weight:bold;
	color:red;
}
.success{
	font-weight:bold;
	color:color;
}



/* ----- Customer Cart TABLES ---------- */
#awscustomertables table{margin: 1em; border-collapse: collapse;}
#awscustomertables td{ padding: .3em; border: 1px #F2F2F2 solid; }
#awscustomertables th{ padding: .3em; border: 1px #F2F2F2 solid; background: #F2F2F2; }
