﻿/********************************************
   AUTHOR:          http://www.ambitiouswebdesign.com 
   WEBSITE:     http://www.starlightfarms.com/
   TEMPLATE NAME:  Starlight Farms
   DATE:           Feb-13th-2009
 *******************************************/ 
 
/********************************************
   HTML ELEMENTS
********************************************/ 
 
* { margin: 0; padding: 0px; }

html, body { 
margin: 0;
padding: 0px;
height: 100%; 
background: #061d33 url('images/bg.jpg') no-repeat center top;
} 

.line { border: none; border-bottom: 1px solid #4e5b28; height: 0px; margin: 0 auto }
.clear { clear: both; }

/*Highlight field with error */
input.error { border: 1px solid red; }
label.error {
	padding-left: 16px;
	margin-left: .1em;
}
label.valid {
	display: block;
	width: 16px;
	height: 16px;
}

/* ----------CART--------------------- */
font, table, tr, td { border: none; background-color: transparent;}
table, td, tr { border: none; font: 9pt "Lucida Sans Unicode", Tahoma, Verdana, Arial, sans-serif; color: #e1e1e1; }
td { line-height: 20px; }
table b { color: #e1e1e1; }
t
table a, tr a, td a, font a, .content table a {color: #e1e1e1; font: 9pt "Lucida Sans Unicode", Tahoma, Verdana, Arial, sans-serif;
	text-align: center;
}
le 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 #e1e1e1; height: 0px;}
font img { border: 6px solid #e1e1e1; margin-right: 10px; }


/* ----------Centered Container Or the Layout--------------------- */
#container { 
min-height: 70%; 
height: auto !important; 
height: 70%; 
margin: 0 auto -4em; /* make sure this matches in the body footer DIV */
width: 940px;
background: #061d33 url('images/mainbg.gif') repeat-x;
} 

/* --------------LABELS BUTTONS & FORMS-----------*/
 
label {
color: white;
font-family: “Lucida Sans Unicode”, sans-serif;
font-size: 12px;
font-style: normal;
font-weight: bold;
letter-spacing: normal;
}
 
.form {
width: 32em;
color: #f4f2e8;
font-family: “Lucida Sans Unicode”, sans-serif;
font-size: 12px;
font-style: normal;
letter-spacing: normal;
padding: 10px;
margin-bottom: 20px;
background: url(/images/labelbg.png) repeat;
border: none;
}

textarea {
width: 32em;
color: #f4f2e8;
font-family: “Lucida Sans Unicode”, sans-serif;
font-size: 12px;
font-style: normal;
letter-spacing: normal;
padding: 10px;
margin-bottom: 20px;
background: url(/images/textareabg.png) repeat;
border: none;
overflow: hidden

}

 
.button {
width: 6em;
font-family: Cambria, serif;
font-size: 20px;
color: #233a4d;      
background: #cddeec;
padding: 4px 5px;
border: 1px solid #cddeec;
}

/* --------------HEADER------------- */

#header, .suckertreemenu, #mission, #contactbar { width: 940px; margin: 0 auto;}

#header { height: 117px;}

#header .text {
position: absolute;
width: 250px;
color: white;
margin-top: -12px;
margin-left: 115px;
font-family: “Lucida Sans Unicode”, sans-serif;
font-size: 12px;
font-style: italic
}

/* --------------LOGO IN HEADER *always use this*------------- */
.logolink, #swap { width: 259px; height:97px;}
.logolink { background-image: url('/images/logo.png'); background-repeat: no-repeat;}
.logolink a { float: left;  }
 
#swap { background-image: url(/images/logo.png); }
 
.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 */


/* --------------TOPNAV------------- */
.suckertreemenu { background: url(/images/navbg.png) repeat-x; height: 58px;}
.suckertreemenu img { border: none;padding-top: 20px; padding-left: 10px; padding-right: 30px;}


.suckertreemenu ul{
margin: 0;
padding-left: 0px;
list-style-type: none;
letter-spacing: 0px;
}

/*Top level list items*/
.suckertreemenu ul li{
position: relative;
display: inline;
float: left;
z-index: 5;

}

/*Top level menu link items style*/
.suckertreemenu ul li a{
display: inline;
font: 8pt Tahoma, Arial, Verdana, Sans-serif;
color: #FFF;
text-decoration: none;
padding-left: 30px;
padding-right: 30px;
}

.suckertreemenu ul li a:hover { }

/*1st sub level menu*/
.suckertreemenu ul li ul{
left: 0em;
position: absolute;
top: 0em; /* no need to change, as true value set by script */
display: block;
visibility: hidden;
margin-top: 0px;
margin-left: 35px;
border-top: 1px solid #233a4d;
border-right: 1px solid #233a4d;
border-left: 1px solid #233a4d;
}

/*Sub level menu list items (undo style from Top level List Items)*/
.suckertreemenu ul li ul li{
display: list-item;
float: none;
}

/*All subsequent sub menu levels offset after 1st level sub menu */
.suckertreemenu ul li ul li ul{ 
left: 159px; /* no need to change, as true value set by script */
top: 0;
}

/* Sub level menu links style */
.suckertreemenu ul li ul li a {
margin: 0px;
display: block;
overflow: visible;
text-align: left;
font: 8pt Arial, Verdana, Tahoma, Sans-serif;
width: 120px; /*width of sub menu levels*/
color: #fff;
text-decoration: none;
padding: 8px;
background-color: #315571;
top: -12em;
border-bottom: 1px solid #233a4d;
}

.suckertreemenu ul li ul li a:hover { background: #f4f2e8;}
.suckertreemenu ul li a:hover { color: #233a4d;}
.suckertreemenu ul li ul li a:hover{ background-color: #f4f2e8; text-decoration:underline}

* html p#iepara{ /*For a paragraph (if any) that immediately follows suckertree menu, add 1em top spacing between the two in IE*/
padding-top: 1em;
}
	
/* Holly Hack for IE \*/
* html .suckertreemenu ul li { float: left; height: 1%; }
* html .suckertreemenu ul li a { height: 1%; }
/* End */


/* --------------MISSION------------- */
#mission { height: 245px; background: url(/images/missionpic.jpg) no-repeat }
#mission .tag { background: url(/images/missiontag.png) no-repeat; width: 236px; height: 144px; float: right}


/* --------------Contact BAR------------- */
#contactbar {
color: white;
font-family: “Lucida Sans Unicode”, sans-serif;
font-size: 12px;
font-style: normal;
font-weight: normal;
letter-spacing: normal;
color: #fff;
background-color: #315571;
clear: both;
width: 925px;
padding-left: 15px;
padding-top: 1px;
height: 60px;
padding-bottom: 10px
}

#contactbar a, #main a  { color: #f0ca77;}
#contactbar p { padding: 14px 15px 0px 30px;}
#contactbar img { margin: 10px 13px 0px 13px; float: left}

#contactbar .text {
float: left;
width: 320px;
margin: 0px;
padding: 0px;
clear:right
}

#contactbar .one, .two, .three {
float: left;
margin: 0px;
padding: 0px;
clear:right;
}

#contactbar .one, .two {width: 220px;}
#contactbar p { text-align:left}
#contactbar .three { width: 160px;}


/* --------------MAIN CONTENT, LEFT NAVIGATION----------------*/
#main {
min-height: 100%; 
height: auto !important; 
height: 100%; 
}

#main .content {
padding: 15px 15px 15px 0px;
margin-bottom: 75px;
margin-left: 275px;
margin-right: 0px;
min-height: 170px; /* Height of Background Img */
height: auto;
}

#main .welcome {
background: url(/images/homeheading.gif) no-repeat;
height: 78px;
width: 320px;
}

#main h1 {
color: #cddeec;
font-family: Cambria, serif;
font-size: 26px;
font-style: normal;
font-weight: normal;
letter-spacing: normal;
line-height: 1.2em;
margin-bottom: 16px;
}


#main p {
color: white;
font-family: “Lucida Sans Unicode”, sans-serif;
font-size: 12px;
font-style: normal;
font-weight: normal;
letter-spacing: normal;
line-height: 1.5em;
padding-bottom: 22px;
}

#main div {
color: white;
font-family: “Lucida Sans Unicode”, sans-serif;
font-size: 12px;
font-style: normal;
font-weight: normal;
letter-spacing: normal;
line-height: 1.5em;
}

#main ul { margin: 0px; padding: 0px}
#main ul li a {
font-family: “Lucida Sans Unicode”, sans-serif;
font-size: 12px;
font-style: normal;
font-weight: normal;
letter-spacing: normal;
line-height: 1.5em;
padding-left: 10px;
}


#main .img {
border: none;
}

/* --------------LEFTSIDE------------- */
#main .left {
float:left; 
width: 240px;
height: 420px;
min-height: 420px;
margin: 20px 0px 0px 15px;
padding: 0px;
background: url(/images/navleftbg.gif) repeat-y top right;
}

#main .left .gallery, #main .left .test { width: 219px; height: 200px; margin-bottom: 30px;}

#main .left p {
padding: 10px 8px 0px 10px;
color: #f4f2e8;
font-family: “Lucida Sans Unicode”, sans-serif;
font-size: 11px;
line-height: 1.5em;
font-style: italic;
margin-bottom: 15px;
}

#main .left b {
padding: 10px 8px 0px 10px;
color: #fff;
font: 11px “Lucida Sans Unicode”, sans-serif;
line-height: 1.5em;
font-style: italic
}

#main .left .gallery .bg {background: url(/images/gallerybg.png) no-repeat; height: 178px;}
#main .left .gallery .bg img { margin: 20px 15px 0px 15px; border: none;} 

#main .left .head { height: 44px; background: url(/images/lefthead.gif) no-repeat; }
#main .left .head p {
padding: 4px 0px 0px 17px;
font-family: Cambria, serif;
font-size: 20px;
font-style: normal;
letter-spacing: normal;
}

/* --------------SALE BARN------------- */

#sale { 
border-bottom: 1px solid #213648; 
margin: 0px; 
height: 100%; 
height: auto; 
min-height: 100%; 
clear: right; 
background-color: #384f63; 
padding: 10px;
}

#sale .icon, .detailpic { float: left; border: 5px solid #f4f2e8; width: 165px; }
#sale .text { text-align: left; padding: 0px 0px 13px 20px; margin-left: 175px; 
min-height: 100%;
height: 100%;
height: auto; 
  }

#sale .infobutton {
border: none; margin-top: 15px;
}

#sale .text b {
font-size: 24px;
font-weight: normal;
letter-spacing: normal;
color: #cddeec;
}


* html #sale p{ /* IE 3px jog hack*/
height: 1%;
}

#sale .text p { padding-bottom: 0px; clear:right}

.salehr {
height:12px;
background: url('/images/trips_hr.gif') no-repeat;
border: none;
border: 0px;
padding-bottom: 15px;
}

/* --------------DETAILS------------- */
.detailtext { text-align: left; padding: 0px 0px 13px 20px; margin-left: 182px;  }

/* --------------PEDIGREES------------- */
#pedigrees { margin: 0px; padding: 0px;}
#pedigrees td { width: 20%; text-align: center; padding-bottom:30px;}
#pedigrees img { border: 5px solid #f4f2e8}

#pedigrees h3 {
color: #cddeec;
font-family: Cambria, serif;
font-size: 18px;
font-style: normal;
font-weight: normal;
letter-spacing: normal;
}

/* --------------GALLERY------------- */
.gallery { margin: 0px; padding: 0px;}
.gallery td { width: 20%; text-align: center; padding-bottom:30px; padding-right: 10px; vertical-align: bottom;}
.gallery img { border: 5px solid #f4f2e8}

.gallery h3 {
color: #cddeec;
font-family: Cambria, serif;
font-size: 18px;
font-style: normal;
font-weight: normal;
letter-spacing: normal;
}

/* --------------FOOTER------------- */
#footer, .push { 
clear: both;
width: 100%;
height: 4em; /* make sure this matches in the body container DIV */
bottom: 0;
left: 0;
margin: 0 auto; 
position: relative;
} 

#footer {
background: url(/images/footerbg.png) no-repeat top center;
height: 262px;
min-height: 262px;
height: auto;
margin-top: -175px;
}

#footer .content { 
width: 940px; 
margin: 0 auto; 
position: relative; 
}

#footer .textholder { padding-top: 150px }


/* --------------FOOTER LINKS------------- */
#footer ul { padding: 6px 10px 0px 10px;}

#footer .text {
color: #cddeec;
padding: 10px 0px 0px 20px;
font-family: “Lucida Sans Unicode”, sans-serif;
font-size: 12px;
font-style: italic
}

/* --------ASC LINKS--------- */
#footer .asc ul { margin: 0px; padding: 0px;}
#footer .asc li { display: block; list-style-type: none;}

#footer .asc li a {
color: #fff;
text-decoration: none;
padding: 0px 10px 0px 10px;
font: 10px “Lucida Sans Unicode”, sans-serif;
}

/* --------W3 LINKS--------- */
#footer .w3 ul { margin: 0px; padding: 10px;}
#footer .w3 li { display: inline; list-style-type: none;}
#footer .w3 li a { color: #fff; text-decoration: none; border-right: 1px solid; padding: 0px 10px 0px 10px; font: 10px “Lucida Sans Unicode”, sans-serif;}
#footer .w3 li a:hover { text-decoration: underline;}







/* ----- 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; }
