/************************************************************
	The Flag Loft Screen CSS
	Created: 4/20/05
	Last Modified:	
	Author:	Matt Jacob
************************************************************/

/************************************************************
	START basic layout elements
************************************************************/

.clear {
	padding: 0;
	margin: 0;
	height: 0;
	clear: both;
}

.displaynone {
	display: none;
}

* {
	padding: 0;
	margin: 0;
}

ul {
	list-style: none;
}

body {
	/* text-align to center container in IE5.x/Win */
	text-align: center;
	padding: 0;
	margin: 0;
	font: normal 12px/15px verdana, helvetica, arial, sans-serif;
	color: #333;
	background-color: #fff;
	font-size: 62.5%;
}

/*
	remember pseudo-class order
	:link, :visited, :hover, :focus, :active
*/

a img { border: 0; }

a { color: #069; text-decoration: none; }

a:link { color: #069; }

a:visited { color: #069; }

a:hover {
	color: #333399;
}

a:focus {
	color: #ccc;
}

a:active {
	color: #336699;
}
p {
	font-size: 1.1em;
	margin: 0 0 10px 0;
}
h1 {
	font-size: 1em;
}
h2 {
	font-size: 2.2em;
	color: #A9252A;
	margin: 3px 0 20px 0;
	font-weight: normal;
	padding-left: 28px;
	background: url(../m/images/gfx_h2.gif) 0 50% no-repeat;	
}
h3 {
	font-size: 1.6em;
	color: #303380;
	margin: 0 0 5px 0;
	font-weight: normal;
	padding-bottom: 5px;
	/*border-bottom: dotted 1px #333399;*/
}
h4 {
	font-size: 1.4em;
	color: #999;
	font-weight: normal;
	margin: 0 0 5px 0;
}
#mainContainer {
	width: 78.9em;
	margin: 1.5em auto 0;
	border: solid 1px #333399;
	text-align: left;
}
#header {
	width: 78.9em;
	height: 12.5em;
	border-bottom: solid 1px #333399;
	background: #fff url(../m/images/header.gif) no-repeat;
	text-indent: -5000px;
	position: relative;
	margin-bottom: 8px;
}

#col_left {
	width: 16.4em;
	float: left;
	margin-bottom: 15px;
}

#col_center {
	/*width: 60.5em;*/
	width: 42.6em;
	float: left;
	padding: 0;
	/* hide from Mac IE 5.2 \*/
	padding: 0 0 0 3px;
	/* end hide */
}
body.products #col_center, body.cart #col_center, body.receipt #col_center {
	width: 60.5em;
	padding: 0 8px 0 5px;
}
#col_center h3 {
	/*text-transform: uppercase;*/
}
#col_right {
	width: 19.6em;
	float: left;
}


/************************************************************
	START header elements
************************************************************/
#header h3 {
	border: none;
}
/* Holidays */
#header ul#holidays {
	width: 290px;
	height: 48px;
	position: absolute;
	top: 50px;
	left: 485px;
	text-indent: 0;
	font-size: 1.2em;
	font-weight: bold;
	color: #fff;
}
li#holiday1 {
	margin-left: 3px; 
}
li#holiday2 {
 margin: 1px 0 0 10px; 
}
li#holiday3 {
 margin: 1px 0 0 17px;
}
/* end holidays */
#header dl {
	position: absolute;
}

/************************************************************
	START left_col elements
************************************************************/
#col_left h3 {
	width: 14.6em;
	height: 2.8em;
	background: #fff url(../m/images/h_choose_product.gif) no-repeat;
	text-indent: -5000px;
	font-size: 1em;
	margin: 15px 0 0 0;
	padding: 0;
	border: none;
}
#col_left fieldset {
	border: solid 1px #333399;
	border-left: none;
	width: 13.9em !important;
	width: 14.4em;
	padding: 0.3em;
	float: none;
}
#col_left fieldset input {
	margin-left: 0.3em;
	width: 60px;
}

a#cart {
	padding: 10px 0 0 23px;
	/* hide from Mac IE 5.2 \*/
	padding: 10px 0 0 23px;
	/* end hide */
	margin-left: 10px;
	line-height: 1.8em !important;
	line-height: 2em;
	font-size: 1.2em;
	vertical-align: 50%;
	background: #fff url(../m/images/cart_icon.gif) 0 5px no-repeat;
}

/************************************************************
	START home page elements
************************************************************/
body.home #col_center {
	padding: 0;
}
h2#welcome {
	font-size: 1em;
	width: 39em; 
	/* hide from Mac IE 5.2 \*/
	width: 40.6em;
	*width: 39em; 
	/* end hide */
	height: 10em;
	background: #fff url(../m/images/welcome_bg.gif) no-repeat;
	text-indent: -5000px;
}
/* center column call outs */
body.home h3 {
	border: none;
}
#product_line, #custom_products, #csr, #fast_delivery {
	margin: 0.8em 0;
}
#product_line {
	width: 20.8em;
	height: 11.8em;
	background: #fff url(../m/images/product_line_bg.gif) no-repeat;
	text-indent: -5000px;
	float: left;
}
#custom_products {
	width: 21.1em;
	height: 11.8em;
	background: #fff url(../m/images/custom_products_bg.gif) no-repeat;
	text-indent: -5000px;
	float: left;
	margin-left: 0.3em;
}
#csr {
	width: 20.8em;
	height: 12.6em;
	background: #fff url(../m/images/csr_bg.gif) no-repeat;
	text-indent: -5000px;
	float: left;
}
#fast_delivery {
	width: 21.1em;
	height: 12.5em;
	background: #fff url(../m/images/fast_delivery_bg.gif) no-repeat;
	text-indent: -5000px;
	float: left;
	margin-left: 0.3em;
}
/* right column call outs */

#companies, #schools, #police, #property, #auto {
	width: 196px;
	margin-bottom: 2px;
	position: relative;
}
#companies h3, #schools h3, #police h3, #property h3, #auto h3 {
	position: absolute;
}
#companies {
	height: 64px;
	background: #fff url(../m/images/companies_bg.gif) no-repeat;
	text-indent: -5000px;
}
#schools {
	height: 77px;
	background: #fff url(../m/images/schools_bg.gif) no-repeat;
	text-indent: -5000px;
}
#police {
	height: 79px;
	background: #fff url(../m/images/police_bg.gif) no-repeat;
	text-indent: -5000px;
}
#property {
	height: 80px;
	background: #fff url(../m/images/real_estate_bg.gif) no-repeat;
	text-indent: -5000px;
}
#auto {
	height: 69px;
	background: #fff url(../m/images/auto_dealers_bg.gif) no-repeat;
	text-indent: -5000px;
}
#companies a, #schools a, #police a, #property a, #auto a {
	width: 85px;
	height: 12px;
	display: block;
	position: absolute;
	font-size: 12px;
}
#companies a, #auto a {
	top: 47px;
	left: 100px;
}
#schools a, #police a, #property a {
	top: 59px;
	left: 100px;
}

/************************************************************
	START top navigation
************************************************************/
ul#nav_top {
	width: 59.0em !important;
	width: 59.6em;
	height: 2.5em;
	position: absolute;
	top: 100px !important;
	top: 98px;
	top/**/:/**/99px;
	left: 198px !important;
	left: 194px;
}
ul#nav_top li {
	float: left;
	height: 25px;
}
ul#nav_top li a {
	display: block;
	width: 100%;
	height: 100%;
}
ul#nav_top li#home { width: 68px; }
ul#nav_top li#about { width: 84px;}
ul#nav_top li#faq { width: 114px;}
ul#nav_top li#products { width: 78px;}
ul#nav_top li#custom { width: 78px; }
ul#nav_top li#specials { width: 83px;}
ul#nav_top li#contact { width: 85px;}

ul#nav_top li#home a { background: #fff url(../m/images/btn_home.gif) no-repeat;}
ul#nav_top li#about a {background: #fff url(../m/images/btn_about.gif) no-repeat;}
ul#nav_top li#faq a {background: #fff url(../m/images/btn_faq.gif) no-repeat;}
ul#nav_top li#products a {background: #fff url(../m/images/btn_products.gif) no-repeat;}
ul#nav_top li#custom a {background: #fff url(../m/images/btn_custom.gif) no-repeat;}
ul#nav_top li#specials a {background: #fff url(../m/images/btn_specials.gif) no-repeat;}
ul#nav_top li#contact a {background: #fff url(../m/images/btn_contact.gif) no-repeat;}

ul#nav_top li#home a:hover, ul#nav_top li#about a:hover, ul#nav_top li#faq a:hover, ul#nav_top li#products a:hover, ul#nav_top li#custom a:hover, ul#nav_top li#specials a:hover, ul#nav_top li#contact a:hover {
	background-position: -114px 0;
}

/************************************************************
	START left navigation
************************************************************/
ul#nav_left {
	width: auto;
}
ul#nav_left li {
	margin-bottom: 0.1em;
}
ul#nav_left li a {
	height: 24px;
	width: 158px;
	display: block;
	text-indent: -5000px;
	background-position: 0 0;
}
ul#nav_left li a#us {
	height: 2.6em;
	background: #fff url(../m/images/btn_product_us.gif) no-repeat;
}
ul#nav_left li a#state {
	background: #fff url(../m/images/btn_product_state.gif) no-repeat;
}
ul#nav_left li a#c_flags {
	background: #fff url(../m/images/btn_product_custom.gif) no-repeat;
}
ul#nav_left li a#c_banners {
	background: #fff url(../m/images/btn_product_banners.gif) no-repeat;
}
ul#nav_left li a#military {
	background: #fff url(../m/images/btn_product_military.gif) no-repeat;
}
ul#nav_left li a#historical {
	background: #fff url(../m/images/btn_product_historical.gif) no-repeat;
}
ul#nav_left li a#religious {
	background: #fff url(../m/images/btn_product_religious.gif) no-repeat;
}
ul#nav_left li a#international {
	background: #fff url(../m/images/btn_product_international.gif) no-repeat;
}
ul#nav_left li a#assorted {
	background: #fff url(../m/images/btn_product_assorted.gif) no-repeat;
}
ul#nav_left li a#flagpoles {
	background: #fff url(../m/images/btn_product_flagpoles.gif) no-repeat;
}
ul#nav_left li a#accessories {
	height: 2.5em;
	background: #fff url(../m/images/btn_product_accessories.gif) no-repeat;
}
ul#nav_left li a#us:hover, ul#nav_left li a#state:hover, ul#nav_left li a#c_flags:hover, ul#nav_left li a#c_banners:hover, ul#nav_left li a#military:hover, ul#nav_left li a#historical:hover, ul#nav_left li a#religious:hover, ul#nav_left li a#international:hover, ul#nav_left li a#assorted:hover, ul#nav_left li a#flagpoles:hover, ul#nav_left li a#accessories:hover {
	background-position: -158px 0;
}

/************************************************************
	START shopping cart elements
************************************************************/
td.subtotal, td.shipping, td.total {
	text-align: right;
	font-weight: bold;
}
td.price, td.totalprice {
	font-weight: bold;
}
td.totalprice {
	color: red;
}
a.proceed, a.update, a.shop {
	text-indent: -5000px;
	display: block;
	float: right;
}
a.proceed {
	width: 143px;
	height: 23px;
	background: url(../m/images/proceed_check_btn.gif) no-repeat;
	margin-top: 5px;
}
a.shop { 
	width: 140px;
	height: 23px;
	background: url(../m/images/shop_btn.gif) no-repeat;
	margin: 5px;
}
a.update {
	width: 102px;
	height: 23px;
	background: url(../m/images/update_cart_btn.gif) no-repeat;
	margin-top: 5px;
}


/************************************************************
	START product elements
************************************************************/
body.products_list h3 {
	margin-top: 5px;
}
img.category {
	float: left; 
	border: solid 1px #ccc; 
	margin: 0 5px 10px 0; 
	width: 100px; 
	height: 70px;
}
div.p_container {
	width: 100%; 
	clear: both; 
	position: relative;
	padding-top: 57px;
	margin-top: 10px;
	margin-bottom: 20px;
}
div.p_container h3 {
	padding-left: 110px;
	padding-bottom: 0;
	border: none;
}
.product_img {
	width: 100px; 
	height: 70px; 
	border: solid 1px #ccc; 
	position: absolute; 
	top: 0; 
	left: 0;
}
table {
	margin-top: 10px 0 15px 0;
	width: 100%; 
}
table thead tr {
	background-color: #171796; 
	color: #fff;
}
table thead tr th.options { width: 120px; }
table tbody tr {
	text-align: center; 
	font-size: 1.2em;
}
table tbody tr.odd { background-color: #E3E3ED; }
table tbody tr td { padding: 2px 0;}
td.info { width: 75px; }
td.add_cart {	width: 85px;}
td.info a, td.add_cart a {
	display: block;
	text-indent: -5000px;
	height: 14px;
}
td.info a { 
	background: url(../m/images/more_info.gif) no-repeat;
	width: 73px;
}
td.add_cart a {
	background: url(../m/images/add_cart.gif) no-repeat;
	width: 83px;
}

/************************************************************
	START specials elements
************************************************************/
span.old_price {
	text-decoration: line-through;
	display: block;
	width: 100%;
}
span.special_price {
	color: red;
}
/************************************************************
	START state/territory elements
************************************************************/
body.states #col_center {
	width: 60.5em;
}
/************************************************************
	START search results elements
************************************************************/
body.search #col_center {
	width: 60.5em;
}

span#search {
	color: red;
}
table#search {
	margin-bottom: 15px;
}
table#search td {
	text-align: left;
	padding-left: 10px;
}

/************************************************************
	START map elements
************************************************************/
img#map_usa {
	position: absolute;
	top: 0;
	left: 0;
}
/************************************************************
	START warning elements
************************************************************/
ul#error_list {
	padding-left: 20px;
	list-style-type: square;
	font-size: 1.3em;
	margin-bottom: 15px;
}

/************************************************************
	START right column contact elements
************************************************************/
.assistance {
	background: #E2F4E2;
	border-top: solid 1px #338C4E;
	border-bottom: solid 1px #338C4E; 
}
.assistance h3, .assistance p {
	margin-left: 5px;
	margin-top: 5px;
}
/************************************************************
	START standard form layout elements
************************************************************/
span.required {
	color: red;
	display: inline;
	width: auto;
}

fieldset {
	width: 350px;
	border: none;
	margin: 15px 0;
	border: solid 1px #ccc;
	padding: 0;
	float: left;
}

fieldset.submit {
	 border: none;
	 margin-top: 0;
}

fieldset legend {
	padding: 5px;
	background-color: #ECEAEA;
	border: solid 1px #999;
	margin-left: 10px;
	font-size: 1.4em;
	display: none;
	/* hide from Mac IE 5.2 \*/
	display: inline;
	/* end hide */
}

fieldset label {
	display: block;
	width: 330px;
	clear: both;
	padding: 10px;
}

fieldset label.odd {background-color: #EAEAF6;}

fieldset p {
	padding: 10px;
}

fieldset label span {
	font-size: 1.2em;
	width: 90%;
	clear: left;
}

fieldset label span.label, fieldset label span.label_other {
	width: 100%;
	float: left;
	font-weight: bold;
	margin-bottom: 5px;
}
fieldset label span.label_other {
	margin-top: 5px;
	font-weight: normal;
}
span.checkbox {
	width: 100%;
	margin: 3px 0;
	float: left;
}

fieldset input, fieldset select, fieldset textarea {
	width: 200px;
}

span.checkbox input, input.submit, fieldset.submit input {
	width: auto;
}

ul.bullets {
	list-style-type: disc;
	padding-left: 25px;
	margin-bottom: 5px;
}
select#credit_month, select#credit_year {
	width: 110px;
	display: inline;
	margin: 0 3px 0 0;
}

/************************************************************
	START faq elements
************************************************************/
body.faq #col_center {
	padding: 0;
}
h4.question, p.answer {
	padding: 0 10px 0 30px;
	position: relative;
}
h4.question {
	padding-top: 15px; 
	background: url(../m/images/faq_top.jpg) no-repeat;
}
p.answer {
	margin-top: 10px;
	padding-bottom: 15px;
	background: url(../m/images/faq_btm.jpg) left bottom no-repeat;
}
h4.question span, p.answer span {
	position: absolute;
	left: 10px;
}
h4.question span {
	color: #333399;
}
p.answer span {
	font-size: 1.4em;
	color: #A9252A;
}
body.faq #col_right {
	background-color: #F4EBEB;
	border-top: solid 5px #A9252A;
	border-bottom: solid 5px #A9252A;
	padding-top: 3px;
	margin-bottom: 5px;
}
body.faq #col_right h3 {
	padding-left: 10px;
}
dl {
	padding-left: 10px;
	width: auto;
}
dt {
	font-size: 1em;
	font-weight: bold;
}
dd {
	margin-bottom: 5px;
}
/************************************************************
	START about elements
************************************************************/
body.about #col_center {
	width: 60.5em;
}
/************************************************************
	START order confirmation and receit elements
************************************************************/
#shipped, #billed {
	width: 250px;
	float: left;
	margin: 15px 0;
}
#billed {
	margin-right: 10px;
}

/************************************************************
	START footer elements
************************************************************/
p#footer {
	width: 78.9em;
	margin: 0 auto;
	text-align: right;
	color: #333399;
	font-size: 1em;
	font-weight: bold;
	padding-top: 5px;
}
p#footer a {
	margin: 0 0.5em;
	color: #333399;
}
p#footer span { margin: 0 0.5em; }
