﻿/*
    DOLON Software Solutions, Inc. 2009 - All rights reserved.

    !IMPORTANT: When you change the styles, check as soon as you can on IE and FF. This will ensure the styles are consistent and reduce
        headaches later.
*/

html, body, form
{
    height: 100%;           /* The height is required for the 100% height look. We need to set it for "form" because it is also a container. */
    margin: 0px;
    padding: 0px;
    
    font-family: Arial Narrow;    /* Site-wide font setting */
}

body
{
    background: #144da2 url(images/background.png) repeat-x top;
    height: 100%;
}
form
{
    height: 100%;
}

img
{
    border: none;
}

/* Layout styles */
#wrapper_div
{
    margin: 0px auto 0px auto !important;         /* This style will keep the div centered in the parent container */
    padding: 0px;
    width: 890px;
}

body > #wrapper_div
{
    height: 100%;
    height: auto; 
    min-height: 100%;
}

#header_div
{
    margin: 0;
    padding: 0;
    width: 100%;            
}

#content_div
{
    clear: both;
    color: #FFF;
    padding-bottom: 100px;      /* Part of the sticky footer code. The 100px padding is to supplement the styles set for the footer */
    width: 100%;
}

/* Sticky Footer - http://www.cssstickyfooter.com/using-sticky-footer-code.html */
#footer_div
{
    background: #000;
    
    /* Sticky footer code */
	clear:both;
    margin: -100px auto 0px auto;   /* negative value of footer height */
    position: relative;
	height: 100px;
	
    width: 100%;
}

#footer_content
{
    margin: 0 auto;         /* This style will keep the div centered in the parent container */
    padding: 10px;
    
    width: 880px;
}

/* Standard Styles */
/*  Implement these per site design */
a
{
    font-family: Arial Narrow;
    font-size: small;
    font-weight: normal;
}
a:link, a:visited
{
    color: #FFF;
    text-decoration: none;
}
a:hover
{
    color: #FFEA00;
}

/* !! This one is important as it is used by Google for SEO. We should try to use this as headlines in the site. */
h1
{
    color: #FFF;
    font-family: Arial Narrow;
    font-weight: bold;
    font-size: x-large;
}

h2
{
    color: #FFEA00;
    font-family: Arial Narrow;
    font-size: large;
}

hr
{
    border: 0;
    border-top: 1px solid #787878;
}

p
{
    margin: 0 0 15px 0;
    padding: 0px;
}

blockquote
{
    background: url(images/quote.png) no-repeat top left;
    padding: 10px 0px 0px 20px;
}

/* Start your custom styles */
.clearfix:after 
{
    content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix 
{
    display: inline-block;
}
/* Hides from IE-mac \*/
* html .clearfix 
{ 
    height: 1%;
}
.clearfix 
{
    display: block;
}
/* End hide from IE-mac */

/* Image-Swap menu code */
#menu
{
    margin: 0px 0px 10px 10px;
}

#menu a
{
    float: left;
    font-size: medium;
    font-weight: bold;
    margin-right: 20px;
}

#menu_home
{
    background: url(images/menu_home.png) top left;
    margin: 0;
    padding: 0;
    height: 11px;
    width: 44px;
}
#menu_home:hover
{
    background: url(images/menu_home.png) bottom left;
    height: 11px;
    width: 44px;
}

#menu_about
{
    background: url(images/menu_about.png) top left;
    margin: 0;
    padding: 0;
    height: 11px;
    width: 72px;
}
#menu_about:hover
{
    background: url(images/menu_about.png) bottom left;
    height: 11px;
    width: 72px;
}

#menu_services
{
    background: url(images/menu_services.png) top left;
    margin: 0;
    padding: 0;
    height: 11px;
    width: 65px;
}
#menu_services:hover
{
    background: url(images/menu_services.png) bottom left;
    height: 11px;
    width: 65px;
}

#menu_rates
{
    background: url(images/menu_rates.png) top left;
    margin: 0;
    padding: 0;
    height: 11px;
    width: 45px;
}
#menu_rates:hover
{
    background: url(images/menu_rates.png) bottom left;
    height: 11px;
    width: 45px;
}

#menu_bins
{
    background: url(images/menu_bins.png) top left;
    margin: 0;
    padding: 0;
    height: 11px;
    width: 136px;
}
#menu_bins:hover
{
    background: url(images/menu_bins.png) bottom left;
    height: 11px;
    width: 136px;
}

#menu_faq
{
    background: url(images/menu_faq.png) top left;
    margin: 0;
    padding: 0;
    height: 11px;
    width: 41px;
}
#menu_faq:hover
{
    background: url(images/menu_faq.png) bottom left;
    height: 11px;
    width: 41px;
}

#menu_contact
{
    background: url(images/menu_contact.png) top left;
    margin: 0;
    padding: 0;
    height: 11px;
    width: 90px;
}
#menu_contact:hover
{
    background: url(images/menu_contact.png) bottom left;
    height: 11px;
    width: 90px;
}

/* Header content styles */
#logo
{
    background: url(images/logo.png) no-repeat;
    float: right;
    /* We need negative margins here to obtain the "overlapped" look */
    position: relative;
    margin-top: -227px;
    margin-right: -65px;
    
    height: 140px;
    width: 339px;
    z-index: 800;
}

#header_swf
{
    float: left;
    margin: 20px auto 0px auto;
    height: 184px; 
    width: 885px;
}
object
{
    float: left;
    z-index: 200;
}

/* Main content styles */
#default_content
{
    margin: 0px;
    padding: 10px;
    width: 480px;
}

.up_arrow
{
    border: 0px;
    float: right;
    height: 10px;
    width: 10px;
}

#right_pane
{
    float: right;
    margin: 0px;
    padding: 10px;
    width: 350px;
}

#right_pane ul
{
    list-style-type: none;
}
#right_pane li
{
    margin: 10px 0px 10px 10px;
}
#right_pane img
{
    margin: 5px;
}

#faq
{
    list-style-type: none;
}
#faq li
{
    margin: 20px 0px;
}
#faq h2
{
    margin: 0px;
}
#faq p
{
    margin-left: 25px;
}
/* Footer content styles */
#footer_menu
{
    padding-right: 20px;
}
#footer_menu ul
{
    float: right;
    margin: 0;
    padding: 0;
}
#footer_menu ul li
{
    float: left;
    list-style-type: none;
}
#footer_menu a:link, #footer_menu a:visited
{
    font-size: small;
    font-weight: normal;
    padding: 0 5px 0 5px;
}

#copyright
{
    color: #FFF;
    float: left;
    font-size: small;
    padding-left: 20px;
}

#developed_by
{
    clear: both;
    color: #FFF;
    font-size: small;
    font-weight: normal;
    padding: 35px 20px 0px 0px;
    text-align: right;
}

#developed_by a
{
    font-size: small;
    font-weight: normal
}

.tabs
{
    list-style: none;
    margin: 0;
    padding: 0;
}
.tabs li
{
    display: inline;
    margin-right: 15px;
}

.gallery
{
}
