﻿/*---- STYLES APPLIED TO ALL HTML ----*/

@import 'common.css';

/*---- STYLES APPLIED TO FEATURE.HTML ----*/

div#wrapper #content {
  top: 0;
  ;
}

div #header {
  display: none;
  ;
}

div.titlePic {
  background: transparent url( ../images/titles/newsletter.png ) no-repeat center;
  ;
}

.hLine {
  margin: 0 40%;
  border-left: 0; /*Don't delete this line*/
  ;
}

#intro {
  position: relative;
  width: 90%;
  height: auto;
  margin: 0 5%;
  ;
}
  div#intro p {
    font-size: 1.3em;
    text-align: left;
    line-height: 1.1em;
    width: 70%;
    margin: 0 15%;
    ;
  }
    p.copy#noJS, p.copy#notReady {
      text-align: center;
      ;
    }
    p.copy#first {
      margin-bottom: 1em;
      ;
    }
    p.copy#last {
      margin-top: 1em;
      ;
    }
    span#eMail {
      /*font-weight: bold;*/
      color: #5a0087; /* Purple */
      ;
    }
    div#bWrapper1, form#bWrapper2 {
      display: block;
      clear: both;
      width: 22%;
      margin: 2em 39% 0;
      ;
    }
    input#continue, input#submit {
      float: left;
      /*height: 31px;
      width: 88px;*/
      ;
    }
    input#decline, input#cancel {
      float: right;
      /*height: 31px;
      width: 88px;*/
      ;
    }


/*---- STYLES APPLIED TO NLSFORM_02 ----*/

fieldset#fldsNLSform02 {
  height: auto;
  padding: 5px;
  margin: 4em 15% 0;
  border: 1px solid black;
  ;
}
  /*---- COLUMNS ----*/
  div.column#left {
    float: left;
    width: 50%;
    ;
  }
  div.column#right {
    float: right;
    width: 50%;
    ;
  }

  .sectionBox {
    margin: 0; /* Don't change/delete! */
    padding: 0.2em;
    border: 1px dotted blue;
    ;
  }
  .grpTitle {
    font-size: 85%;
    height: 1em;
    margin: 0; /* Don't change/delete! */
    ;
  }
  .grpBox {
    width: auto;
    margin: 0.3em 0.3em 0;
    ;
  }
  .grpTxt {
    display: inline;
    font-size: 60%;
    margin: 0 0 0 0.2em; /* Don't change/delete! */
    ;
  }
  p.grpInputs {
    margin: 0;
    ;
  }
  .fInputs {
    height: 1em;
    margin: 2px 0 2px 0.3em;
    ;
  }
  form#NLSform02 span {
    margin: 0; /* Don't change/delete! */
    ;
  }
  form#NLSform02 input {
    font-size: 9px; /* Don't change/delete! */
    cursor: pointer;
    height: 1.4em;
    margin-right: 2px;
    ;
  }
  .subText {
    display: inline;
    font-size: 80%;
    margin-left: 0.5em; /* Don't change/delete! */
    ;
  }
  div#name, div#address, div#phones, div#eMail, div#music {
    display: block;
    width: 90%;
    ;
  }
    form#NLSform02 input {
      font-size: 9px;
      ;
    }
      form#NLSform02 input.suggest {
        color: #b0c4de; /* LightSteelBlue */
        ;
      }
      form#NLSform02 input.required {
        color: #ff0000; /* Red */
        ;
      }
      form#NLSform02 input.hasFocus, form#NLSform02 input.hasBlur {
        color: #000000; /* Black */
        ;
      }

      form#NLSform02 input.valid {
        color: #000000; /* Black */
        ;
      }


    /************************************** Left column **************************************/


    /********************** NAME **********************/

    div.sectionBox#name {
      background-color: #ffefd5; /* PapayaWhip */
      ;
    }
    div.grpBox#firstName {
      /*width: 10.7em;*/
      ;
    }
    div.grpBox#middleName {
      /*width: 2.7em;*/
      margin: -2.1em 0pt 0pt 7.15em;
      ;
    }
    div.grpBox#lastName {
      /*width: 10.7em;*/
      margin: -2.15em 0pt 0pt 10em;
      ;
    }
      input.inputs#ipFirstName1 {
        width: 9.4em;
        ;
      }
      input.inputs#ipMiddleName1 {
        width: 3.5em;
        ;
      }
      input.inputs#ipLastName1 {
        width: 13.5em;
        ;
      }
      .subText#middle {
        margin-left: 14.7em;
        ;
      }
      .subText#last {
        margin-left: 2.8em;
        ;
      }

  /********************** ADDRESS **********************/

  div#address {
    height: 8em;
    ;
  }
    input.addrFields#addrStreet1 {
      width: 17.4em;
      ;
    }
    input.addrFields#addrStreet2 {
      width: 9.5em;
      ;
    }
    #addrGroupTwo span, #addrGroupThree span {
      margin-top: 3px;
      ;
    }
      input.addrFields#addrAptNbr {
        width: 5.7em;
        ;
      }
      input.addrFields#addrCity {
        width: 12em;
        ;
      }
      input.addrFields#addrStateProv {
        width: 8em;
        ;
      }
      input.addrFields#addrPostCode {
        width: 7em;
        ;
      }
      input.addrFields#addrCntry {
        width: 10em;
        ;
      }
      .subText#addrStreet2 {
        margin-left: 16.3em;
        ;
      }
      .subText#addrAptUnit {
        margin-left: 3.9em;
        ;
      }
      .subText#addrStProv {
        margin-left: 11.8em;
        ;
      }
      .subText#addrPostCode {
        margin-left: 2.4em;
        ;
      }

  /********************** PHONES **********************/

    div#phones {
      height: 8.3em;
      ;
    }
      input.phoneInputs#pCtryCode {
        width: 2.8em;
        ;
      }

      /********************** PHONE WIRED **********************/

      input.phoneInputs#pWiredPfx {
        width: 4em;
        ;
      }
      input.phoneInputs#pWiredNbr {
        width: 13.5em;
        ;
      }
      input.phoneInputs#pWiredExt {
        width: 5em;
        ;
      }
      p.subText#pCode1SubText {
        margin: 0;
        ;
      }
      p.subText#pCode2SubText {
        display: block;
        margin: -0.3em 0 0.3em .7em;
        ;
      }
      p.subText#pCode3SubText {
        display: block;
        margin: -2.1em 0 2.1em 0.2em;
        ;
      }
      .subText#pPrefix {
        margin-left: 5.3em;
        ;
      }
      .subText#pNumber {
        margin-left: 1.2em;
        ;
      }
      .subText#pExt {
        margin-left: 11.9em;
        ;
      }

      /********************** PHONE FAX **********************/

      span.fInput#phoneGroupTwo {
        display: block;
        margin: -0.9em 0 0.9em 2.3em;
        ;
      }
      input.phoneInputs#pFaxPfx {
        width: 4em;
        ;
      }
      input.phoneInputs#pFaxNbr {
        width: 13.5em;
        ;
      }
      input.phoneInputs#pFaxExt {
        width: 5em;
        ;
      }
      p.subText#pFaxSubText {
        display: block;
        margin: 0.4em 0 0 0.2em;
        ;
      }
      .subText#pFaxPrefix {
        margin-left: 5.3em;
        ;
      }
      .subText#pFaxNumber {
        margin-left: 1.2em;
        ;
      }
      .subText#pFaxExt {
        margin-left: 13.1em;
        ;
      }

      /********************** PHONE MOBILE **********************/

      span.fInput#phoneGroupThree {
        display: block;
        margin: 0.5em 0 -0.5em 2.3em;
        ;
      }
      input.phoneInputs#pMobilePfx {
        width: 4em;
        ;
      }
      input.phoneInputs#pMobileNbr {
        width: 13.5em;
        ;
      }
      input.phoneInputs#pMobileExt {
        width: 5em;
        ;
      }
      p.subText#pMobileSubText {
        display: block;
        margin: 0.4em 0 0 0.2em;
        ;
      }
      .subText#pMobilePrefix {
        margin-left: 5.3em;
        ;
      }
      .subText#pMobileNumber {
        margin-left: 1.2em;
        ;
      }
      .subText#pMobileExt {
        margin-left: 9.2em;
        ;
      }

  /********************** EMAIL **********************/

    div#eMail {
      height: 5.7em;
      ;
    }
      span.fInput#phoneGroupThree {
        display: block;
        margin: 0.5em 0 -0.5em 2.3em;
        ;
      }
      input.eMailInputs#eMail1, input.eMailInputs#eMail2 {
        width: 20em;
        ;
      }
      p.subText#pMobileSubText {
        display: block;
        margin: 0.4em 0 0 0.2em;
        ;
      }


  /************************************** Right column **************************************/

    /********************** MUSIC **********************/

    div.sectionBox#music {
      background-color: #eee8aa; /* PaleGoldenrod */
      ;
    }
      input.inputs#ipMusic1, input.inputs#ipMusic2 {
        width: 100%;
        height: 5em;
        ;
      }

  /*---- END STYLES APPLIED TO NLSFORM_01 ----*/

div.footer {
  margin-top: 5em;
  ;
}
