/*
  core.css (make it so number one!)

  All attributes in alpha-numeric order starting from 0-9 A-Z
  x = horizontal, y = vertical
  property: trbl, tb rl, t rl b, t r b l;
  bg shorthand: background: color url() repeat vertical-position horizontal-position;
  All font names should be quoted "Arial"
  However, font families like Serif, Sans-Serif and Monospace do not need quotes.

*/

/* TABLE OF CONTENTS
-----------------------------------------------------------------------------

  =RESET
  =BASE TYPO
  =IMAGES
  =LINKS
  =FORMS
  =TABLES
  =ADDRESS
  =FRAMEWORK

*/

/* =RESET
  no editing required
----------------------------------------------------------------------------- */

html, body, br, hr,
div, span, a,
object, iframe,
ul, ol, dl, li, dt, dd,
h1, h2, h3, h4, h5, h6,
p, blockquote, q, address,
small, big, cite, dfn, ins, del,
i, em, b, strong, sup, sub, strike,
pre, code, samp, kbd, var, tt,
form, fieldset, legend, label,
input, textarea, option, .nobox{
  background: transparent;
  border: 0;
  font-size: 100%;
  margin: 0;
  outline: none;
  padding: 0;
  vertical-align: baseline;
}

blockquote, q{ quotes: none; }

br{ height: 0; }

ul, ol, dl{ list-style: none; }

a img{ border: 0; }

img{ display: block; }
img.inline{ display: inline; vertical-align: middle; }

/* =BASE TYPO
----------------------------------------------------------------------------- */

body{ font: normal normal 12px "Arial", Sans-Serif; }

code, samp, kbd, var{ font-family: "Courier New", "Courier", Monospace; }

h1, h2, h3, h4, h5, h6, b, strong{ font-weight: bold; }
i, em, cite, dfn, ins{ font-style: italic; }
del, code, samp, kbd, var{ font-style: inherit; }

del{ text-decoration: line-through; }
ins{ text-decoration: none; }

abbr, acronym{ border: 0; cursor: help; text-decoration: none; }

h1{ font-size: 24px; }
h2{ font-size: 30px; }
h3{ font-size: 18px; }
h4{ font-size: 16px; }
h5{ font-size: 14px; }
h6{ font-size: 13px; }

ul, dl{ list-style: square; margin:0 0 0 20px; }
ol{ list-style: decimal; }

li, dt, dd,
p, pre, address,
legend, label, input, textarea,
select, option, optgroup,
th, td{ font: inherit; }

small{ font-size: 10px; }   /* 2px smaller, than body base */
big{ font-size: 14px; }   /* 2px larger, than body base */

/* =IMAGES
----------------------------------------------------------------------------- */

img.left,
img.right{
  background: #EFEDE5;
  border: 1px solid #003910;
  margin: 0 10px 5px;
  padding: 3px;
}

  img.left{ margin-left: 0; }
  img.right{ margin-right: 0; }

  img.none{
    background: transparent;
    border: 0;
    padding: 0;
  }

/* =LINKS
----------------------------------------------------------------------------- */

a{ text-decoration: underline; }

/* =FORMS
----------------------------------------------------------------------------- */

label{
  font-size: 12px;
  font-weight: bold;
}

input,
textarea{
  background: #FFFFFF;
  border: 1px solid;
  border-color: #AAAAAA #CCCCCC #CCCCCC #AAAAAA;
  padding: 3px 5px;
  width: 350px;
}

textarea{ height: 150px; }

.button input,
input.button,
.checkbox input{ width: auto; }

fieldset.button{ margin-top: 15px; }

.button input{
  background-color: #003910;
  border: 0;
  color: #FFFFFF;
  text-transform: uppercase;
}

fieldset.checkbox label,
fieldset.checkbox input,
fieldset.inline label,
fieldset.inline input{ float: left; }

  fieldset.inline label{
    display: block;
    padding: 5px 0;
    width: 75px;
  }

  fieldset.inline input{ margin-bottom: 10px; }

  .checkbox input{
    background: transparent;
    border: 0;
    margin-right: 5px;
    vertical-align: middle;
  }

/* =CONTACT-FORM
----------------------------------------------------------------------------- */

#customer-service-request-form fieldset,
#contact-form fieldset{
  position: relative;
}

#customer-service-request-form label,
#contact-form label,
#friendo-form label{
  display: block;
  margin-bottom: 5px;
}

#customer-service-request-form h2,
#contact-form h2,
#friendo-form h2{
  font-size: 14px;
  margin: 20px 0;
}

#contact-form .half-box{
  float: left;
  margin-right: 40px;
  width: 170px;
}

#customer-service-request-form input,
#contact-form input,
#friendo-form input{ margin-bottom: 10px; }

  #contact-form .address-form input{ margin-right: 5px; }

  #contact-form .city input{ width: 200px; }
  #contact-form .state input{ width: 45px; }
  #contact-form .zip input{ width: 70px; }

  #contact-form fieldset.checkbox label{ margin-right: 10px; white-space: nowrap; }

.instruct{
  background: #F6EAC8 url(../images/ico/instruct.gif) no-repeat 0 -15px;
  border: 1px solid #DBC37D;
  display: none;
  position: absolute;
  right: 0;
  top: 0;
  width: 260px;
}

  #customer-service-request-form .instruct p{ padding: 0 10px; }
  #contact-form .instruct p{ padding: 0 10px; }

  #customer-service-request-form input.f-error,
  #customer-service-request-form textarea.f-error,
  #contact-form input.f-error,
  #contact-form textarea.f-error,
  #friendo-form input.f-error,
  #friendo-form textarea.f-error{
    background: #FFE6E6;
    border: 1px solid #B33737;
    color: #B33737;
  }

.error,
.success{
  background: #FFE6E6;
  border: 1px solid #B33737;
  color: #B33737;
  margin: 15px 0;
  padding: 10px;
}

  #friendo-form .error,
  #friendo-form .success{ width: 340px; }

  .success{
    background: #EAFFE5;
    border: 1px solid #5BA14B;
    color: #5BA14B;
  }

    #wrap .success h3,
    #wrap .success p{
      margin: 0;
      padding: 0;
    }

      #wrap .success h3{
        color: #5BA14B;
        font-weight: bold;
        margin-bottom: 10px;
      }

      #wrap .success p.close-box{
        border-top: 1px solid #9CD28F;
        margin-top: 10px;
        padding-top: 5px;
        text-align: right;
      }

/* =TABLES
----------------------------------------------------------------------------- */

table{ width: 100%; }

th, td{ padding: 8px; }

th{ text-align: left; }

/* =ADDRESS
----------------------------------------------------------------------------- */

address{ font-style: normal; }

  #sidebar address{ margin: 15px 15px 0; }

  address span{ display: block; }

  address br{ display: none; }

  address span.locality,
  address span.region,
  address span.postal-code,
  address span.type,
  address span.value{ display: inline; }

  address span.fn,
  address span.org{ font-weight: bold; }

  address span.dl{ margin: 15px 0; }

/* =FRAMEWORK
----------------------------------------------------------------------------- */

.hide{ display: none; }
.hidden{ display:none; visibility:hidden; z-index:0; width:0px; height:0px; }
.left{ float: left; }
.right{ float: right; }

.float-cleared{ /* use sparingly */
  clear: both;
  height: 0;
  font-size: 0;
}

.float-clear:after{
  content: ".";
  clear: both;
  display: block;
  height: 0;
  font-size: 0;
  visibility: hidden;
}

.txt-right{ text-align: right; }
.txt-left{ text-align: left; }
.txt-center{ text-align: center; }
.txt-justify{ text-align: justify; }
